Solucionar problemas

Cómo corregir la previsualización de enlaces en Facebook y WhatsApp

Revisado el · open graph · redes sociales

Facebook y WhatsApp generan la vista previa de una URL leyendo las etiquetas Open Graph de su HTML. Si faltan datos, la imagen no es accesible o la red social conserva una versión anterior en caché, el enlace puede aparecer sin foto, con un título antiguo o sin descripción.

Etiquetas Open Graph necesarias

Comprueba el código fuente de la URL compartida, no solo el contenido que muestra el navegador. Como mínimo debería incluir valores equivalentes a estos:

<meta property="og:type" content="website">
<meta property="og:url" content="https://ejemplo.com/articulo">
<meta property="og:title" content="Título de la página">
<meta property="og:description" content="Descripción clara de la página">
<meta property="og:image" content="https://ejemplo.com/imagenes/compartir.jpg">

La URL de og:image debe ser absoluta, usar HTTPS y responder públicamente sin sesión, cookies ni protección antibots. Como referencia práctica, una imagen de 1200 x 630 píxeles funciona bien en formatos de enlace horizontales.

En WordPress, plugins como Yoast SEO o All in One SEO pueden generar estas etiquetas, pero conviene comprobar el HTML final para descartar duplicados creados por el tema, otro plugin o una caché.

Diagnóstico paso a paso

  1. Abre la URL en una ventana privada y confirma que devuelve la página correcta sin iniciar sesión.
  2. Consulta el código fuente y verifica que existe un único valor coherente para og:url, og:title, og:description y og:image.
  3. Abre directamente la URL de og:image y comprueba que carga por HTTPS y no redirige a una página de error.
  4. Revisa que robots.txt, el firewall, el CDN o un sistema anti-DDoS no bloqueen al rastreador de Meta.
  5. Comprueba que la URL canónica y og:url no apuntan a otra variante del dominio.

Puedes reproducir la descarga con el agente de Facebook desde una terminal:

curl -L -A "facebookexternalhit/1.1" https://ejemplo.com/articulo
curl -I -A "facebookexternalhit/1.1" https://ejemplo.com/imagenes/compartir.jpg

La primera orden debe devolver el HTML con las etiquetas y la segunda una respuesta correcta para la imagen. Un 403, 404, timeout o una redirección hacia el acceso explica por qué no se genera la vista previa.

Vaciar la caché de Facebook

  1. Entra en el Depurador de contenido compartido.
  2. Introduce la URL exacta y pulsa Depurar.
  3. Revisa la respuesta obtenida, las etiquetas detectadas y los avisos.
  4. Después de corregir el origen, pulsa Volver a extraer para solicitar una lectura nueva.

El depurador permite verificar lo que Facebook puede leer y actualizar su caché. WhatsApp puede mantener su propia copia durante un tiempo, por lo que una vista correcta en el depurador no implica una actualización inmediata en todas las conversaciones.

Si sigue apareciendo la vista anterior

Vacía primero las cachés de WordPress, del servidor y del CDN. Después confirma que el HTML público ya contiene los valores nuevos y vuelve a extraer la URL. Cambiar solo el archivo de imagen manteniendo la misma URL puede conservar una copia antigua; versionar la URL de og:image, por ejemplo con un nombre nuevo, permite invalidarla de forma controlada.

Si necesitas un entorno con HTTPS, caché y soporte para revisar este tipo de incidencias, consulta nuestros planes de hosting PHP.

También te puede ayudar

  1. Advertencia ¡Borrado de actividad en curso! en Moodle
  2. Aprendiendo a depurar errores en aplicaciones PHP como Wordpress
  3. Confirmación de pedidos en tiendas con pasarela Redsys y certificado SSL de tipo SNI
  4. Cómo solucionar el error cURL 60 de certificado SSL en WordPress Cómo diagnosticar y resolver el error cURL 60 de WordPress sin desactivar la verificación de certificados SSL.