Sin categoría

Si usted es un blogger, un comercializador de redes sociales o incluso un pequeño empresario, en algún momento probablemente se encontrará con el problema de que Facebook no muestra la imagen correcta de su sitio WordPress. A veces, Facebook saca una imagen vieja o peor aún, ninguna imagen en absoluto. Afortunadamente, puede solucionar fácilmente estos problemas usando una herramienta llamada Facebook Debugger. Vea algunos escenarios comunes a continuación que puede encontrar y cómo resolverlos.

Cómo Facebook Extrae Información

Cada vez que comparte cosas con WordPress, Facebook almacena sus imágenes en sus servidores y CDN. Puede pensar en esto de la misma manera que funciona la cache de su sitio, a veces tiene que borrarla para que las cosas funcionen nuevamente. Lo mismo ocurre a veces con Facebook. Si realiza actualizaciones en su sitio, Facebook puede mostrar una imagen anterior cuando vaya a compartirla, esto es porque no busca información nueva, sino que sirve la información que ya ha almacenado en cache.

Lo mismo ocurre con la información sobre su enlace y el contenido en sí. Buscan lo que llaman Open Graph Meta Tags. De acuerdo con Facebook, el protocolo de Open Graph permite que cualquier página web se convierta en un objeto en un gráfico social. Básicamente, estas son etiquetas (código) que le informan a Facebook sobre lo que está compartiendo.

¿No está seguro de si está utilizando Open Graph Meta Tags en su sitio? Bueno, probablemente lo esté, pero es posible que no lo sepa. 😉 Si está usando plugins populares como Yoast SEO o Social Warfare, estos de hecho, agregan automáticamente estas etiquetas detrás de escena.

Tomemos nuestra guía de optmización de velocidad de sitio web como ejemplo. Si miramos el código fuente de esa publicación, podemos ver los siguientes datos con respecto a Open Graph. Nota: Open Graph usa diferentes atributos, como og:title y el que realmente nos importa para este tutorial esog:image. Este es el código en nuestro sitio que Facebook examina para determinar qué imagen, título y descripción destacados mostrar.

 

 

<meta property="og:locale" content="en_US" />
<meta property="og:type" content="article" />
<meta property="og:title" content="A Beginner's Guide to Website Speed Optimization (WordPress-Friendly)" />
<meta property="og:description" content="In-depth website speed optimization guide that shows you how important it is to have a snappy website. DIY instructions and tricks to improve load times." />
<meta property="og:url" content="http://youweb.pro/learn/page-speed/" />
<meta property="og:site_name" content="Kinsta Managed WordPress Hosting" />
<meta property="article:publisher" content="https://www.facebook.com/youweb.pro" />
<meta property="article:author" content="https://www.facebook.com/propietario />
<meta property="article:tag" content="webdev" />
<meta property="article:tag" content="webperf" />
<meta property="fb:app_id" content="148976462317083" />
<meta property="og:image" content="http://youweb.pro/wp-content/uploads/2016/03/website-speed-optimization-2.png" />
<meta property="og:image:secure_url" content="http://youweb.pro/wp-content/uploads/2016/03/website-speed-optimization-2.png" />

 

Es importante tener en cuenta que esto no actualizará la imagen de las publicaciones de Facebook ya compartidas. Esto solo afecta las publicaciones en las que usted u otras personas comparten después de los hechos.

Consejos Adicionales de Facebook Debugger

Puede utilizar la herramienta Facebook Debugger no solo para actualizar imágenes antiguas, sino también el contenido (texto) que se ve en sus publicaciones de Facebook. El título y la descripción son Open Graph Meta Tags. Entonces, si necesita reformular algo, actualícelo en WordPress y siga exactamente los mismos pasos anteriores.

Las Características de la ‘og:image’ Proporcionada Aún no Están Disponibles

Además, solo porque ignoramos las advertencias anteriores no significa que sean inútiles siempre. De hecho, hay tamaños recomendados cuando se trata de imágenes que debería usar. De lo contrario, cosas malas pueden suceder. Como una imagen que no aparece en absoluto (como se ve a continuación en esta advertencia).

 

Las propiedades proporcionadas ‘og: image’ aún no están disponibles porque las imágenes nuevas se procesan de forma asíncrona. Para garantizar que los recursos compartidos de las nuevas URLs incluyan una imagen, especifique las dimensiones con las etiquetas ‘og: image: width’ y ‘og: image: height’.

Lo anterior ocurrió porque nuestra imagen era demasiado pequeña. El tamaño de imagen mínimo que Facebook requiere es de 200 x 200 píxeles. Por lo general, cuanto más grande, mejor cuando se trata de imágenes de Facebook. Buffer tiene una gran publicación con todos los tamaños de imágenes recomendados para las redes sociales. 1,200 x 630 pixeles parece funcionar mejor para la mayoría de las personas. Está bien que aumente también, de hecho, nuestra imagen en nuestra publicación en el primer ejemplo fue de 1460 x 730. Solo recuerde que Facebook recortará todo lo que será mayor, por lo que mantener esa relación de aspecto es una de las partes más importantes.

 

Si está utilizando un plugin como Yoast SEO, también puede ser recomendado que configure la imagen manualmente. Quizás sus imágenes destacadas en su tema de WordPress tengan una relación de aspecto o tamaño diferente. ¡O quizás ni siquiera use imágenes destacadas!

 

En este caso, Yoast SEO plugin le permite cargar manualmente una imagen de tamaño diferente solo para Facebook, que llenará aquellas Open Graph Meta Tags . También puede establecer manualmente el título y la descripción si es necesario.

 

Las Siguientes Características Requeridas Faltan: fb:app_id

Esta advertencia también puede ver sobre la Facebook App ID faltante. Es importante notar que esto no interfiere con la capacidad de compartir publicaciones de Facebook en modo alguno. Muchas veces puede ignorarla. Sin embargo esto sí limita su capacidad de usar los datos de Facebook Insights.

Las Siguientes Características Requeridas Faltan: fb:app_id

Las Siguientes Características Requeridas Faltan: fb:app_id

Si quiere datos adicionales de Insights, necesita agregar Facebook App ID a su sitio. A continuación puede leer las instrucciones sobre cómo hacerlo.

  1. Cree su Facebook App: https://developers.facebook.com/docs/apps/register(completamente gratuito).
  2. Copie su Facebook App ID desde el panel de control de la aplicación.
  3. En su panel de control WordPress haga clic en «SEO» en el lado izquierdo
  4. Bajo la pestaña «Facebook» puede introducir su Facebook App ID.

por kinsta

Deja una respuesta

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

Publicar comentario