Cómo hacer que WhatsApp obtenga la imagen representativa de una página web

Chandra9000 · 20/10/22, 20:07:59

Hola, estoy haciendo una web con una sola página, que no puede ser más simple: una sola imagen, y debajo varios párrafos cortos.

Todos vemos que cuando en un teléfono móvil enviamos a alguien por WhatsApp el link a una página, WhatsApp de alguna forma obtiene una imagen "representativa" (no sé el nombre correcto, seguro que es otro porque buscando en Google con ese no he encontrado ninguna información sobre lo que pregunto aquí) de esa página, lo une al título de esta, y lo manda todo junto con el link, con lo cual la presentación queda mucho más atractiva (y útil para el receptor, por la función aclaratoria de la imagen).

P.ej, si envío por WhatsApp el link a este cómic en Amazon:

https://www.amazon.es/Imposible-Patr.../dp/8490248672

WhatsApp se las apaña para buscar, entre la multitud de imágenes que hay en la página, justo la de la imagen del cómic, y la envía junto con el título ("La Imposible Patrulla-X 1. ¡Segunda Génesis! (Gold - Imposible Patrulla X): ... ") y el link, y todo eso es lo que ve el receptor del mensaje; mucho más chulo que si solo viera el link. ¡Y además, Amazon incluye hasta un pequeño resumen!

Pero ¿cómo demonios se hace eso? En mi página solo tengo una imagen y solo una (es la imagen de cabecera), y cuando le envío a alguien el link por WhatsApp, este solo manda el título, sin imagen, y eso que solo tengo una (joder, más fácil para WhatsApp imposible) :-( ...

Muchas gracias por anticipado, un saludo...

frightenrugby · 03/07/23, 03:43:40

Tengo la misma situación que tú y no sé cómo solucionarlo.

funny shooter

Chandra9000 · 03/07/23, 23:05:09

Se resuelve con las metaetiquetas Open Graph. Al final resulta que era mucho más fácil de lo que parecía

jeraldlopez · 17/09/23, 21:08:55

I also have the same issue

jessicagarland · 03/11/23, 07:33:36

Cita:

Originalmente Escrito por Chandra9000

Hola, estoy haciendo una web con una sola página, que no puede ser más simple: una sola imagen, y debajo varios párrafos cortos.

Todos vemos que cuando en un teléfono móvil enviamos a alguien por WhatsApp el link a una página, WhatsApp de alguna forma obtiene una imagen "representativa" (no sé el nombre correcto, seguro que es otro porque buscando en Google con ese no he encontrado ninguna información sobre lo que pregunto aquí) de esa página, lo une al título de esta, y lo manda todo junto con el link, con lo cual la presentación queda mucho más atractiva (y útil para el receptor, por la función aclaratoria de la imagen).

P.ej, si envío por WhatsApp el link a este cómic en Amazon:

https://www.amazon.es/Imposible-Patr.../dp/8490248672 smash karts

WhatsApp se las apaña para buscar, entre la multitud de imágenes que hay en la página, justo la de la imagen del cómic, y la envía junto con el título ("La Imposible Patrulla-X 1. ¡Segunda Génesis! (Gold - Imposible Patrulla X): ... ") y el link, y todo eso es lo que ve el receptor del mensaje; mucho más chulo que si solo viera el link. ¡Y además, Amazon incluye hasta un pequeño resumen!

Pero ¿cómo demonios se hace eso? En mi página solo tengo una imagen y solo una (es la imagen de cabecera), y cuando le envío a alguien el link por WhatsApp, este solo manda el título, sin imagen, y eso que solo tengo una (joder, más fácil para WhatsApp imposible) :-( ...

Muchas gracias por anticipado, un saludo...

Puedes usar una herramienta gratuita como OpenGraph.dev para generar las etiquetas Open Graph de tu página web y copiarlas en tu código HTML. También puedes usar el Depurador de uso compartido de Facebook para verificar que tus etiquetas Open Graph se muestran correctamente.

Ratsa43 · 16/11/23, 02:49:42

Cita:

geometry dash subzero

Puedes usar una herramienta gratuita como OpenGraph.dev para generar las etiquetas Open Graph de tu página web y copiarlas en tu código HTML. También puedes usar el Depurador de uso compartido de Facebook para verificar que tus etiquetas Open Graph se muestran correctamente.

Todavía no lo entiendo del todo...