Configura etiquetas META para Facebook

Ahora que hemos creado nuestro blog con nuestra temática favorita y ya vamos empezando a tener un trafico decente e incluso generando algunos ingresos es también importante configurar correctamente nuestro blog para poder ser compartir en las redes sociales de forma correcta.

A muchos nos debe haber pasado que queremos compartir nuestro blog y no lo vemos como queremos, con una imagen del algún post que se colo o con un texto de algún gadget que no queremos que aparezca, en resumido algo así:

¿Como configurarlo para que se vea bien?
Para suerte nuestra Facebook nos facilita unas etiquetas meta que nos permite manipular esta información a nuestro gusto (Open Graph), podremos elegir que imagen mostrar, que titulo poner y hasta una descripción de nuestro blog teniendo un resultado como este:
Ahora pasaremos a explicar como lograr esto:
 

Nos dirigimos a nuestro editor de plantillas en el blog a editar y 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/'>

Ahora en nuestra misma plantilla justo después de </title> pegamos lo siguiente:

<b:if cond='data:blog.url == data:blog.homepageUrl'>
 <meta content='TITULO DE TU BLOG' property='og:title'/>
 <meta content='blog' property='og:type'/>
 <meta content='URL DE TU BLOG' property='og:url'/>
 <meta content='URL DE NUESTRO LOGO O IMAGEN' property='og:image'/>
 <meta content='DESCRIPCION DE NUESTRO BLOG' property='og:description'/>
 <meta content='NOMBR DE NUESTRO BLOG' property='og:site_name'/>
 </b:if>

Y guardamos los cambios, con esta ya tendremos bien configurados nuestras metas para Facebook.

0
Shares

10 thoughts on “Configura etiquetas META para Facebook

  • abril 30, 2014 en 6:59 am
    Permalink

    Llevaba tiempo buscando algo parecido porque en facebook me comparte como quiere. Gracias!!

    Responder
  • abril 30, 2014 en 11:48 pm
    Permalink

    PORFAVOR HAS UN TUTORIAL PARA CONFIGURAR APPS DE FACEBOOK ESPECIFICAMENTE HECHAS PARA BLOGS O WEB Y QUE QUE VAN DE MANO CON ESTAS ETIQUETAS, GRACIAS :-d

    Responder
    • mayo 1, 2014 en 1:46 am
      Permalink

      Bueno la única app de facebook que he logrado usar con blogger es una que auto-comparte las entradas en nuestros muros, pero esto hará que te bloqueen la cuenta así que no te lo recomiendo [-(

      Responder
      • septiembre 27, 2014 en 6:16 am
        Permalink

        Claro que no, no tienen permiso en bloquear las cuentas así nomas, por algo existen los plugins de Facebook.

        Responder
    • julio 12, 2014 en 4:16 am
      Permalink

      Encontré la apps RSS Graffiti, espero no sea de la que estás hablando, porque me dio miedo! Gracias por tus aportes

      Responder
  • mayo 9, 2014 en 6:05 pm
    Permalink

    Hola gracias por la informacion, mi pregunta es sobre tamaño de la imagen ¿Cualquier tamaño?

    Responder
  • mayo 9, 2014 en 6:08 pm
    Permalink

    Gracias por la informacion, desde Panama, Mi pregunta es sobre el tamaño de la imagen ¿Puede ser cualquier tamaño la imagen o hay un tamaño sugerido?

    Responder
  • septiembre 27, 2014 en 6:18 am
    Permalink

    Facebook configura automáticamente las imágenes de las entradas, inserten bien el código si no quieren que aparezca la misma imagen en todos lados.

    Responder

Deja un comentario

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