
Agregar botones de Facebook y Twitter en WordPress
Si deseas aumentar la interacción de tus publicaciones en WordPress, una excelente opción es agregar botones de «Like» de Facebook y «Compartir» de Twitter. En este artículo, te enseñaré cómo hacerlo de forma sencilla y sin necesidad de plugins adicionales.
Vamos a agregar los botones debajo del título de cada publicación. Para esto, editaremos el archivo functions.php
y el archivo de la plantilla de posts.
Agregar el código en functions.php
Edita el archivo functions.php
de tu tema y agrega la siguiente función para generar los botones:
<?php function addSocialButtons( $content ) { if ( is_single() ) { $postUrl = get_permalink(); $postTitle = get_the_title(); $facebookBtn = '<div class="socialButtons">'; $facebookBtn .= '<iframe src="https://www.facebook.com/plugins/like.php?href=' . urlencode( $postUrl ) . '&width=100&layout=button&action=like&size=small&share=false&height=21" width="100" height="21" style="border:none;overflow:hidden" scrolling="no" frameborder="0" allow="autoplay; clipboard-write; encrypted-media; picture-in-picture; web-share"></iframe>'; $twitterBtn = '<a href="https://twitter.com/share?url=' . urlencode( $postUrl ) . '&text=' . urlencode( $postTitle ) . '" target="_blank" class="twitterShareButton">Compartir en Twitter</a>'; $facebookBtn .= $twitterBtn . '</div>'; return $facebookBtn . $content; } return $content; } add_filter( 'the_content', 'addSocialButtons' );
Agregar estilos CSS opcionales
Para que los botones se vean bien, agrega estos estilos en style.css
de tu tema:
.socialButtons { margin-bottom: 15px; display: flex; gap: 10px; align-items: center; } .twitterShareButton { display: inline-block; background-color: #1DA1F2; color: #fff; padding: 5px 10px; border-radius: 5px; text-decoration: none; font-size: 14px; } .twitterShareButton:hover { background-color: #0d8ddb; }
Con este código, los botones aparecerán automáticamente debajo del título de cada post en WordPress. ¡Así de fácil!