WordPress, Like de Facebook y Open Graph Protocol
publicado el 26.11.10 en Wordpress

Vamos a tratar de hacer funcionar algunos elementos en conjunto. Primero tenemos el botón de Like de Facebook que lo que básicamente hace es, al hace click en el mismo en un sitio externo, agrega en nuestro muro un mensaje con ciertos datos y una referencia en la sección de “Gustos e Intereses” de nuestro perfil.
Por otro lado tenemos un sitio en WordPress. No me refiero precisamente a un blog, sino a un sitio que administre la información con este CMS. Desde la llegada de los custom post types se abrió bastante el abanico de posibilidades de usar WordPress de maneras alternativas (un catálogo de productos, una lista de socios de un club, una carpeta de clientes, etc.). En los casos donde cada post en una ficha lo que voy a tratar de explicar tiene mucho más sentido, de todos modos es totalmente aplicable a un blog normal con artículos.
Cuando añadimos el botón de like en un post de WordPress damos la posibilidad al usuario de publicar en su muro, por default, lo siguiente:
A Nombre le gusta información de la etiqueta <title> en urldelsitio.com
Obviamente nombre se reemplazará por el nombre del usuario en Facebook, el siguiente campo lo llenará con la información que encuentre en la etiqueta <title> (en caso de esta página por ejemplo sería WordPress, Like de Facebook y Open Graph Protocol ~ Gran Impetu) con un enlace a ese permalink y por último la URL del sitio. Inicialmente no va a mostrar en nuestra sección de gustos e intereses este like que acabamos de hacer, ya que no está especificado que tipo de contenido es.
Ahora bien, para poder configurar la manera en que se va a mostrar esto en el muro del usuario y lograr que se agregue a la sección de gustos e intereses con los datos a nuestro piacere necesitamos agregar meta tags de Open Graph protocol con la información correspondiente. Facebook explica como hacerlo de manera manual y cuales son las opciones que nos permite, pero vamos a optimizarlo para que tome estos datos automáticamente desde WordPress.
Sólo vamos a necesitar editar el header.php de nuestro theme. Para empezar modificamos el tag <html> para que Facebook sepa que puede encontrar este tipo de información. Quedaría algo así:
<?php language_attributes() ?> xmlns:og="http://opengraphprotocol.org/schema/" xmlns:fb="http://www.facebook.com/2008/fbml" >
Luego, dentro de
<head>, si les parece bien antes de <?php wp_head() ?>, creamos un loop y agregamos los siguiente:<?php if(is_single()) { ?>
<?php if (have_posts()) : while (have_posts()) : the_post(); ?>
<meta property="og:title" content="<?php the_title() ?>" />
<meta property="og:type" content="movie" />
<meta property="og:url" content="<?php the_permalink() ?>" />
<meta property="og:image" content="<?php bloginfo('template_url') ?>/images/like_image.jpg" />
<meta property="og:site_name" content="<?php bloginfo('name') ?>"/>
<meta property="fb:admins" content="123456789" />
<meta property="og:description" content="<?php echo get_the_excerpt() ?>" />
<?php endwhile; endif; ?>
<?php } ?>
- og:title – Título de lo que me gusta. En este caso va a ser el título del post. Se va a mostrar en el muro junto al sitio al que pertenece y sin otra información en la sección de gustos e intereses.
- og:type – Que tipo de contenido es. Si el post es la ficha de una película, el type será movie como en el ejemplo. La lista completa está en los docs de Facebook. Con esto el post va a aparecer en la sección de gustos e intereses del perfil del usuario, ordenado a demás de su tipo. No lo podemos automatizar a menos que creemos categorías con la lista de todas, las usemos y las llamemos con
<?php the_category() ?>. - og:url – Donde va a enlazar la información que aparezca en Facebook.
- og:image – La imagen que va a acompañar al post. Podemos usar una por defecto, que tome la que hayamos elegido como thumbnail o tomar la primera imagen del post.
- og:site_name – El nombre del sitio para que lo muestre en el muro cuando se hace click en like. Podemos ponerlo a mano o tomar el campo de WordPress como en el ejemplo.
- fb:admins – Debemos introducir nuestra ID de usuario de Facebook para ser los administradores. Esto nos va a servir para saber quienes dieron like, ver estadísticas y demás. Para conocer tu ID anda a tu perfil, hace click en tu avatar y en la URL a la que te dirige podes verlo luego de &id= ¿Hay alguna manera menos engorrosa?
- og:description – Un breve texto que describe el post. En este caso the_excerpt se aplica bien pero si no usan el campo de content puede buscar un custom field por ejemplo.
Algunos campos pueden dejarlos vacíos, Facebook los va a reemplazar y otros no son necesarios. Si ya tiene un botón de like funcionando Facebook no va a actualizar los datos en los perfiles de los usuarios, sólo se va a empezar a aplicar en sus nuevos posts y en los nuevos usuarios a quienes les guste.
¿Alguien ya lo estuvo probando?

