23 Oct

Cómo solucionar los problemas que aparecen al compartir una URL en Facebook, WhatsApp o LinkedIn

Project Manager & SEO @ Vital Innova
Facebook Debug - Soluciona los problemas al compartir tu contenido en WhatsApp y Facebook

Seguro que en más de una ocasión te has encontrado con que Facebook o LinkedIn no están mostrando la información correcta al compartir un enlace en sus redes, bien sea porque está mostrando la imagen que a ti no te gustaría o simplemente no se actualiza con los últimos cambios que has realizado. ¡Maldita caché que siempre está dando guerra!

Por suerte, ambas redes sociales cuentan con herramientas para poder solucionar esto. Pero antes, empecemos por lo básico.

Cómo extraen la información de la vista previa las redes sociales al compartir un enlace

Facebook, WhatsApp, Linkedin o Pinterest, por nombrar algunas de las redes sociales más importantes, basan toda su extracción de datos para sus vistas previas en el protocolo Open Graph , una tecnología sencilla pero efectiva que permite obtener la información relevante de una URL para convertirla, salvando los tecnicismos, en algo atractivo cuando se visualice en un entorno apropiado.

Estos metadatos no son visibles para el usuario que está navegando por la web, pero sí que puedes encontrarlos en el código de fuente de las páginas. Por ejemplo:

Ejemplo de metadatos Open Graph en el código fuente

Estos son los metadatos de nuestra página de servicio de Gestión y estrategia de Redes Sociales. Como se puede ver en la captura, el protocolo utiliza unas metaetiquetas «property» bastante fáciles de entender ya que todas empiezan por el atributo «og:» seguido del nombre del atributo que se quiere definir.

Al final de esa misma captura aparecen los metadatos de Twitter, un protocolo propio basado en el de Open Graph y que permite mostrar las «Cards» de Twitter. Si quieres leer más sobre él, tienes en la web de Twitter una guía.

Si usas algún CMS conocido para tu web como WordPress junto el plugin de Yoast SEO o cualquier otro plugin social, lo habitual es que te estén incluyendo ya estos metadatos. Pero si no los tienes, tendrás que incluirlos en tu página web.

Sacando partido a los «Debugger»

Tanto Facebook como LinkedIn, las dos redes sociales que cachean durante más tiempo la información que extraen de los enlaces, ponen a nuestra disposición dos herramientas para eliminar de su memoria caché la información que han obtenido de las URLs y para aportar más información a cualquier error que hayan podido encontrar.

A través del «Depurador de contenido compartido» de Facebook, podemos ver qué información está obteniendo Facebook y nos da la posibilidad de repetir la extracción borrando esa información que guardaba en memoria para obtener cualquier cambio nuevo que se haya hecho en la URL.

Facebook Debug

Escribiendo la URL y haciendo click en el botón «Depurar», Facebook nos mostrará toda la información que ya tiene de la URL: última fecha de la extracción, código de respuesta, preview, métricas sociales, etc.

👀  Esta herramienta sirve también para corregir la información de los enlaces que se comparten en WhatsApp, ya se usa también el mismo protocolo para la extracción de la información.

El botón «Volver a extraer» que aparece en la parte superior es el que te ayudará a resolver la mayoría de problemas que suelen aparecer cuando se comparte un artículo en Facebook, ya que además de volver a rastrear la página, eliminará toda la información anterior que ya tenía de ella: imagen o título viejo que han cambiado, una descripción nueva, etc.

 

👉🏻  Recuerda: antes de darle a «Volver a extraer», asegúrate de haber eliminado la caché de tu propia página para evitar entrar en un bonito bucle que acabe con tu paciencia.

Principales errores que puedes encontrarte en Facebook

Estos son los principales errores con los que te puedes encontrar:

  • Propiedad inferida: suele aparecer con la propiedad «og:image», y significa que no hay una imagen definida y ha escogido la primera que se ha encontrado en la página. También aparece cuando la imagen que se ha establecido no cumple con las dimensiones mínimas (200×200 píxeles).
  • Faltan propiedades: en este error, Facebook te dirá exactamente qué propiedades no se han definido y que son necesarias para poder hacer de forma correcta la extracción.En este apartado te dirá también que falta la propiedad fb:app_id y te dirá que es obligatoria, pero no te preocupes, tan solo es obligatoria para los datos de Facebook Insights, que dependiendo de tu proyecto usarás o no, pero esto no impide que una URL se comparta de forma correcta en las redes sociales y puedes ignorar la advertencia en la mayoría de los casos.

Linkedin también tiene su propia herramienta para depurar la información

Es el llamado «Post Inspector» y funciona de una forma muy similar, aunque en este caso no hay un segundo botón para volver a extraer y eliminar la información. La eliminación de la caché en este caso va incluida con cada llamada a la URL que se haga al hacer clic en «Inspect».

Post Inspector Linkedin

Bonus

Si usas WordPress y tienes instalado el plugin de Yoast SEO, por defecto ya se añaden estos metadatos a partir de la información que incluyas en tu entrada/página. Pero recuerda que esta información es configurable a través de la pestaña «Social», donde el propio plugin te da la opción de configurar los «og» específicos de imagen, título y descripción.

Y desde las opciones «Social» del propio plugin, fuera de cualquier entrada/página, puedes configurar las opciones por defecto, el ID de la aplicación, activar o desactivar los metadatos Open Graph o definir el tipo de card que más te conviene para Twitter.

Aquí acabamos por hoy. ¡Ahora te toca solo investigar todo lo que has aprendido aquí y plasmar todo esto en tu propia web! Y si te surge cualquier pregunta, no dudes en contactar con nosotros.