Truco WordPress: Agregar un Cuadro de Texto con un Código para enlazarte

En estos días en los que esperamos el Google Dance de manera fervorosa, decidí, y guiado por algunos blogs que ya lo usan, a crear un pequeño cuadro de texto que nos permita darle a nuestros lectores la posibilidad de Copiar directamente el Código HTML necesario para que sea más fácil enlazarnos, de manera que se adapte a nuestro blog y muestre el código necesario en las Entradas.

Me refiero al cuadro que ya hemos Implementado en MarlexSystems, y gracias a la Ayuda de un gran amigo del Mundo Real, lo conseguimos.

Crearlo es muy fácil, simplemente debemos agregar un cuadro de texto, con el siguiente código:

Código para Enlazar: <input type="text" size="70" onfocus="this.select()" style="font-family:Verdana, Arial, Helvetica, sans-serif; font-size:10px" value="&lt;a href=&quot;<?php echo get_permalink() ?>&quot;&gt;<?php the_title(); ?>&lt;/a&gt;">

Esto nos creará un cuadro que nos permitirá, con sólo pasar el mouse por encima, seleccionar el código HTML necesario para poder enlazarnos. Veamos el código parte por parte:

• onfocus=”this.select()”: Nos permitirá seleccionar el texto con sólo poner el mouse sobre el cuadro de Texto que hemos creado.
• style=”font-family:Verdana, Arial, Helvetica, sans-serif; font-size:10px”: Nos permitirá personalizar el diseño del Texto dentro del cuadro, en mi Caso, con la Familia de las Verdada, y un tamaño de 10 píxeles, “a doc” con el Diseño del Blog.
• value=”<a href=”<?php echo get_permalink() ?>”><?php the_title(); ?></a>”: Esto nos creará el Código necesario para poder enlazar mediante un Código HTML, es decir, nos hará el Enlace tipo <a href=”http://www.marlex.org”>MarlexSystems</a> agregando como Anchor, el Título del Post, ideal para Posicionamiento.
• size=”70″: Se refiere al ancho que tendrá nuestro Cuadro de Texto que mostrará el Enlace.

Podemos obtener diferentes formas de acuerdo a lo que buscamos, quizás nuestros lectores no necesitan el código completo en HTML porque usan el Editor Visual de WordPress, en ese caso, podemos darles sólo la URL para enlazarnos, que resultaría en cambiar el valor de “value” por <?php echo get_permalink() ?> que nos agregará automáticamente el permalink de nuestra entrada. El código a usar sería algo así:

Código para Enlazar: <input type="text" size="70" onfocus="this.select()" style="font-family:Verdana, Arial, Helvetica, sans-serif; font-size:10px" value="<?php echo get_permalink() ?>">

Pueden ir variando los Valores para obtener diferentes resultados, así tambien, a algunos les puede parecer muy intrusivo el hecho de que el texto se seleccione de manera automática, por lo que si lo desean desactivar, simplemente remuevan onfocus=”this.select()” del Código resultante y ya.

El resultado lo pueden ver en MarlexSystems donde ya lo hemos implementado, a ver si animamos a enlazarnos! Y recuerden que cada vez que enlacen a MarlexSystems obtendrán un enlace de regreso