Insertar las etiquetas META correctas para que las cosas que se comparten de nuestro blog en Facebook se vean de modo más o menos aceptable no es tan difícil, basta agregarlas y aceptar que en Blogger existen algunas limitaciones que nos impiden personalizar esa parte y obtener el máximo beneficio.
Todas esas etiquetas extras son optativas y se basan en el protocolo Open Graph.
Lo primero que debemos hacer es verificar que la etiqueta HTML de nuestra plantilla, tenga agregado lo siguiente; en las plantillas comunes:
Todas esas etiquetas extras son optativas y se basan en el protocolo Open Graph.
Lo primero que debemos hacer es verificar que la etiqueta HTML de nuestra plantilla, tenga agregado lo siguiente; en las plantillas comunes:
<html xmlns='http://www.w3.org/1999/xhtml' xmlns:b='http://www.google.com/2005/gml/b' xmlns:data='http://www.google.com/2005/gml/data' xmlns:expr='http://www.google.com/2005/gml/expr' xmlns:fb='http://www.facebook.com/2008/fbml' xmlns:og='http://opengraphprotocol.org/schema/'>y en las nuevas plantillas:
<html b:version='2' class='v2' expr:dir='data:blog.languageDirection' xmlns='http://www.w3.org/1999/xhtml' xmlns:b='http://www.google.com/2005/gml/b' xmlns:data='http://www.google.com/2005/gml/data' xmlns:expr='http://www.google.com/2005/gml/expr' xmlns:og='http://opengraphprotocol.org/schema/'>Luego, en el head, antes de <b:include data='blog' name='all-head-content'/>, agregamis los datos generales:
<meta content='EL NOMBRE DEL SITIO' property='og:site_name'/>
<meta content='EL NOMBRE DEL AUTOR' property='og:author'/>
Otros dos datos extras si es que usamos plugins sociales asociados con alguna aplicacion que hayamos creado:
<meta content='ID_CUENTA_FACEBOOK' property='fb:admins'/>
<meta content='ID_APLICACION' property='fb:app_id'/>
La URL de la página la colocamos con los datos de Blogger:
<meta expr:content='data:blog.url' property='og:url'/>
Por último, condicionamos los datos que restan para que difieran entre las entradas individuales y el resto de las páginas. Justamente es acá donde las posibilidades que da Blogger nos impiden optimizar las cosas al máximo:
<b:if cond='data:blog.pageType == "item"'>
<!-- las entradas individuales -->
<meta expr:content='data:blog.pageName' property='og:title'/>
<meta property="og:type" content="article"/>
<!--
lamentablemente, no podemos acceder a un resumen de las entradas
así podemos poner una descripción cualquiera o repetir el título de la entrada o mezclar ambas cosas
-->
<meta expr:content='data:blog.pageName + ". una breve descripción del sitio"' property='og:description'/>
<!--
acá debería ir la imagen que nosotros decidimos mostrar para acompañar la entrada
pero, ese es otro dato al que no podemos acceder
-->
<b:else/>
<!-- cualquier otra página -->
<meta expr:content='data:blog.title' property='og:title'/>
<meta content='blog' property='og:type'/>
<meta content='acá ponemos una breve descipcion de nuestro sitio' property='og:description'/>
<meta content='URL_IMAGENxDEFECTO' property='og:image'/>
</b:if>
Eso es todo. El resultado puede ser verificado usando la herramienta URL Linter que provee el mismo Facebook. Allí, colocamos la dirección a verificar y nos mostrará si hay errores, si faltan datos o cuales son las correcciones que debemos hacer.
No hay comentarios:
Publicar un comentario