Cómo optimizar el “Me gusta” de Facebook en tu blog

Recientemente Facebook liberó una nueva característica que sustituye a la tradicional utilidad conocida a partir de los botones de compartir en Facebook.

Se trata del famoso “Me gusta”, que ahora reúne funcionalidades más avanzadas, las cuales, hacen de este botón un elemento imprescindible a la hora de ofrecerles a los usuarios de tu bitácora, la posibilidad de compartir tus ideas en la red social de una manera mucho más óptima y atractiva.

El cambio consiste, en que cuando un usuario hace clic en el botón «me gusta» de algún post de tu blog, automáticamente dicha acción se verá reflejada en el muro del usuario (y también en las novedades recientes del inicio), donde además del título de la entrada, se desplegará también la imagen del artículo en miniatura, una breve descripción y un campo para comentar, entre otros aspectos.

Como toda novedad que surge desde esta Red Social, las opiniones en la blogosfera no se hicieron esperar , por lo que la novedosa característica ha sido objeto de apreciaciones que a diferencia de otras oportunidades, en esta ocasión las reacciones han sido positivas entre la mayoría de blogueros, así como también, entre quienes se dedican al marketing a través de Facebook.

Sin duda, ahora podemos tener una mejor presencia en los perfiles de nuestros seguidores ya que desde nuestro sitio, podemos personalizar los enlaces compartidos a través de la implementación de etiquetas Meta específicas. Si dichos meta-tags no son incluidos, pues facebook los creará por defecto, arrojando resultados poco atractivos y por lo general imprecisos.  En consecuencia, es necesario optimizar nuestro botón me gusta, de manera tal que los resultados generados impacten positivamente en nuestro weblog.

En Pulso Social, hemos puesto a prueba dicha funcionalidad, por lo que queremos compartirles algunos consejos para optimizar esta función en tu blog.

¿Cómo optimizar esta nueva función?

Ahora no solo es cuestión de tomar el código que nos arroja Facebook  para insertar el botón me gusta en la web, sino que es necesario personalizar la aplicación para poder tener control sobre la apariencia de los enlaces en  los muros de nuestros fans.

Las etiquetas meta, deben incluirse en la cabecera de nuestro sitio, no sin antes cerciorarnos que ya contamos con botón me gusta en nuestro blog. En WordPress nos referimos al archivo header.php  colocando los tags antes de la etiqueta de cierre </head>. EL formato es el siguiente:

[php]<meta property="og:nombre etiqueta" content="valor etiqueta" />[/php]

Las etiquetas que se pueden utilizar son:

og:title:

Este es el texto que deseamos destacar como el titulo del enlace al contenido que nos ha gustado, el cual aparecerá en tono azul y en negrita. En wordpress el valor a colocar debe ser la función que llama los títulos de los post:

[php]<meta property="og:title" content="<?php the_title(); ?>" />[/php]

og:type:

Este es el tipo de enlace que el usuario a compartido como “Me gusta”. Actualmente se encuentran disponibles 38 tipos, siendo “article” el valor más común, cuando de compartir post se trata.  Este tag clasifica los elementos compartidos como “Me gusta” por parte de un usuario especifico agrupando los enlaces relacionados.

og:image:

Esta es la imagen que deseamos mostrar junto al enlace. Si no especificamos este meta-dato, Facebook lo hará automáticamente, tomando imágenes aleatorias para cada enlace compartido. En el peor de los casos hasta el avatar de algún usuario que ha dejado un comentario en tu blog, puede aparecer como imagen destacada de algún post de tu bitácora, lo que puede generar una  mala impresión afectando la relevancia del enlace. Para evitar esto, podemos usar como valor la URL de la imagen del logotipo de tu sitio.

[php]<meta property="og:site_name" content="URL-donde-tienes-tu-logo"; />[/php]

El resultado sería este:

Una  mejor opción, es configurar para que aparezca la imagen exacta que realmente corresponde al post enlazado. Para ello hay muchas opciones de código, siendo la siguiente la que recomiendo:

[php]<meta property="og:image" content="<?php $src = wp_get_attachment_image_src( get_post_thumbnail_id($post->ID), array( 90,55 ), false, » ); echo $src[0]; ?>" />[/php]

Ahora bien, lo anterior funcionará siempre y cuando utilices la funcionalidad de imagen destacada (soporte para thumbnails) en wordpress. Si lo que haces es colocar las imágenes en el cuerpo del post, entonces el plugin Facebook Like thumbnails, te ayudará a mostrar la imagen pertinente a tu contenido.

og:url:

Esto es muy importante, ya que nos permite especificarle a Facebook, cual debe ser la URL (Permalink)  a la que debe apuntar el enlace compartido. En WP sería:

[php]<meta property="og:url" content="<?php the_permalink(); ?>" />[/php]

og:site_name:

Aqúi especificamos el nombre del sitio con el que aparece el enlace.

fb:admins o fb:app_id:

Permite asignar un listado con los ID  de facebook, de los usuarios que deseamos sean administradores de la aplicación para que puedan acceder a las estadísticas del enlace compartido. Para obtener estos ID, basta con pasar el cursor por encima de la imagen de perfil del usuario y de esta manera tomar el ID que aparece en el extremo inferior izquierdo del navegador. En otro caso si el usuario no tiene personalizado la URL de su perfil, pues desde la barra de direcciones se puede apreciar su ID. Como alternativa, podemos especificar un ID de una aplicación de Facebook que hayamos creado.

Og:description:

Permite personalizar el texto descriptivo que aparece en el enlace. Si no especificamos este tag, Facebook tomará por defecto un extracto de nuestro artículo, lo cual está bien. Sin embargo a algunos usuarios en vez de aparecerle el resumen de su post, le aparece datos como la fecha en la que se publico la entrada. Esto se puede solucionar colocando la siguiente función como valor de la etiqueta descripción:

[php]<meta property="og:description"; content="<?php the_excerpt(); ?> />[/php]

También es posible especificar un texto en particular, solo que este se mostrará cada vez que un usuario comparta un post.

Una opción muy optima, es usar una descripción diferente al extracto, asignándole un texto único y atractivo a cada post, utilizando la funcionalidad de Custom Field o campos personalizados. Por ejemplo, podemos crear un campo con nombre “metadescription” y con valor igual al “el texto que queramos”. Ejemplo:

Para cada post tendríamos que asignarle ese campo. Luego en los meta-tags de facebook colocar:

[php]<meta property="og:description" content="<?php echo(get_post_meta($post->ID, "metadescription", true)); ?>" />[/php]

El resultado:

De acuerdo a todo lo anterior, en nuestra header.php podemos colocar como meta-tags de facebook algo como:

[php]<meta property="og:title" content="<?php the_title(); ?>" />
<meta property="og:description" content="<?php echo(get_post_meta($post->ID, "metadescription", true)); ?>" />
<meta property="og:type" content="article" />
<meta property="og:url" content="<?php the_permalink(); ?>" />
<meta property="og:image" content="<?php $src = wp_get_attachment_image_src( get_post_thumbnail_id($post->ID), array( 90,90 ), false, » ); echo $src[0]; ?>" />
<meta property="og:site_name" content="Nombre de tu sitio" />
<meta property="fb:admins" content="ID-1,ID-2,ID-3" />[/php]

Nota: recordemos reemplazar los campos como Nombre del sitio y ID de usuario por los que corresponde a tu web, además de no olvidar colocarlo antes de la etiqueta de cierre </head> en header.php. Además facebook actualiza las páginas cada 24 horas por lo que si deseas ver cambios al instante, debes actualizar manualmente las entradas que desees a través de URL Linter de Facebook.

Cómo implementar las metaetiquetas de facebook rápidamente?

Si eres de los que prefieres no tocar los archivos de tu instalación de WordPress, pues con solo instalar el Plugin WP-OGP, podras personalizar estos meta-datos y tener control de ellos sin tener que editar directamente los ficheros de WP.

Sin duda en el mundo de las redes sociales, las recomendaciones personalizadas están mandando la parada convirtiéndose en una nueva forma de publicidad. De hecho Google acaba de unirse a esta tendencia lanzando el botón+1 a sus resultados de búsqueda ( de esta nueva funcionalidad pronto hablaremos en Pulso), lo que viene a ser el equivalente al nuevo botón Me gusta, que por cierto, es una novedad muy interesante que Facebook nos ofrece para darle un mayor impulso a nuestro contenido en la popular red social. Así que te invitamos a probarla y esperamos que te sea de gran utilidad.