Como colocar las etiquetas tags de facebook en tu pagina web

  • Como colocar las etiquetas tags de facebook en tu pagina web

Como colocar las etiquetas tags de facebook en tu pagina web

Cuando un usuario publica un sitio web en el facebook, habrá notado que en su muro se muestra de esta manera.

publicacion de facebook

Se muestra la imagen de la noticia, el titulo y una breve descripción. A eso se llama meta tags de facebook o Facebook Open Graph META Tags.

Si inspeccionas el código fuente de una página web, notaras que se muestran estas etiquetas.

etiquetas metatags facebook para pagina web

Ya sea en una página web auto gestionable o una página web estática.

Para ir directo al tema, en este articulo indicare como debes colocar los meta tags de facebook en tu pagina web. Eso ayudara también si estas realizando SEO. Si conoces el tema, a buena hora, sino, este tip te servirá de utilidad.

1. Abre un editor de texto como sublime text o el que estés usando.

2. Coloca esto después de la etiqueta

colocar etiquetas metatags facebook en un documento html

3. Una vez modificado tu archivo html, subirlo a un servidor ftp o a tu panel de hosting.

Te preguntaras que significa estas etiquetas y para qué sirven. Aquí te los muestro.

Etiqueta Descripción
og:url

URL canónica de tu página. Debe ser la URL no representativa, sin variables de sesión, parámetros que representen al usuario ni contadores.

Por ejemplo. http://www.tupaginaweb.com

og:title Título del artículo. Por ejemplo, Como crear una página web con responsive.
og:description Breve descripción del contenido (normalmente entre dos y cuatro oraciones). Se mostrará debajo del título de la publicación de Facebook.
og:site_name Nombre de tu sitio web, por ejemplo, Conciertos perú (no conciertosperu.com).
og:image URL de la imagen que aparece cuando alguien comparte el contenido en Facebook.

Como resultado se vera de esta manera.

resultado al publicar la url en el muro de facebook

En el caso de la etiqueta og:image, tienes que utilizar imágenes de al menos 1200 × 630 píxeles para optimizar la visualización en dispositivos de mayor resolución. Como mínimo, utiliza imágenes de 600 × 315 píxeles, con el fin de mostrar publicaciones de página con enlace que incluyan imágenes de mayor tamaño.

Espero que este tutorial te haya sido útil. Para cualquier consulta o sugerencia, dejas tu comentario en la parte debajo.