Blogs / WordPress

Integrar botones sociales en WordPress

Integrar botones sociales en WordPress

Hay unos cuantos plugins para WordPress que permiten integrar los botones sociales con el fin de compartir artículos con amigos y conocidos o con tus seguidores. Pero también existe la posibilidad de integrar estos botones manualmente, sin necesidad de utilizar un plugin. El proceso es muy sencillo, sólo hay que definir unos estilos e insertar una porción de código en los archivos en los que queremos que aparezcan, generalmente en single.php.

Botones sociales

Para integrar los botones de Twitter, Bitácoras, Google Buzz y Facebook (Me gusta), tal como los vemos en la imagen superior, debemos hacer lo siguiente:

Definición de nuevos estilos

Insertaremos en el archivo que gestiona los estilos de nuestro tema (en la mayoría de los casos style.css) la siguiente porción de código:

.socialbotones {overflow:hidden; clear:both; position:relative; width:100%; text-align:left;}
.socialbotones span {position:relative;}
.socialtwitter {float:left; display:inline-block; margin:5px; width:90px;}
.socialbitacoras {float:left; display:inline-block; margin:5px; padding-left:10px; width:90px;}
.socialbuzz {float:left; display:inline-block; margin:5px; width:90px;}
.socialfacebook {float:left; display:inline-block; margin:5px; width:120px;}

Inserción de los botones

Lo normal es que lo hagas en el archivo single.php de tu tema, el que se ocupa de mostrar los artículos. Puedes ponerlo en la parte superior de la entrada, justo debajo del título, a continuación de las etiquetas que muestran el autor, la fecha y el número de comentarios. También puedes incluirlos al final, debajo de la línea que refleja las categorías y etiquetas. Y también es posible incluirlos en ambas zonas. En cualquier caso, el código a añadir es el siguiente:

<div>
<span class="socialtwitter"><a href="http://twitter.com/share" data-count="horizontal" data-via="tu_nombre" data-lang="es">Tweet</a><script type="text/javascript" src="http://platform.twitter.com/widgets.js"></script></span>
<span class="socialbitacoras"><a href="http://bitacoras.com/anotaciones/<?php the_permalink() ?>" target="_blank"><img src="http://widgets.bitacoras.com/votar/mini/<?php the_permalink() ?>" alt="votar" title="Votar esta anotación en Bitacoras.com" style="border:0" /></a></span>
<span class="socialbuzz"><a title="Post on Google Buzz" href="http://www.google.com/buzz/post" data-button-style="small-count" data-locale="es_ES"></a><script type="text/javascript" src="http://www.google.com/buzz/api/button.js"></script></span>
<span class="socialfacebook"><iframe src="http://www.facebook.com/plugins/like.php?href=<?php the_permalink() ?>&amp;layout=button_count&amp;show_faces=true&amp;width=120&amp;action=like&amp;font&amp;colorscheme=light&amp;height=21" scrolling="no" frameborder="0" style="border:none; overflow:hidden; width:120px; height:21px;" allowTransparency="true"></iframe></span>
</div>

Nota importante: No te olvides de cambiar tu_nombre por el que tienes registrado en tu cuenta de Twitter.

Fabriciano González

Amante de la informática y de Internet entre otras muchas pasiones. Leo, descifro, interpreto, combino y escribo. Lo hago para seguir viviendo y disfrutando. Trato de dominar el tiempo para que no me esclavice.

Un comentario

Deja una respuesta

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *

Este sitio usa Akismet para reducir el spam. Aprende cómo se procesan los datos de tus comentarios.