Qué es Open Graph
Open Graph (ogp.me) es un conjunto de etiquetas <meta> que van dentro del <head> de tu página. No se ven en la web, pero le dicen a WhatsApp, Facebook, LinkedIn y otras redes qué foto, qué título y qué descripción mostrar cuando alguien comparte tu link.
Si tu página no las tiene, el link sale como texto pelado: sin foto y sin título. No se instala nada: solo agregás unas líneas al HTML.
Las etiquetas
Open Graph pide cuatro propiedades obligatorias en cada página. Facebook suma og:description a las básicas.
| Etiqueta | Qué define | Obligatoria |
|---|---|---|
og:title |
El título de la tarjeta | Sí |
og:type |
El tipo de contenido (por ejemplo, website) |
Sí |
og:image |
La imagen de la tarjeta | Sí |
og:url |
La dirección de la página | Sí |
og:description |
El texto debajo del título | Facebook la cuenta entre las básicas |
La imagen
| Dato | Valor |
|---|---|
| Tamaño recomendado | Al menos 1200 × 630 píxeles |
| Proporción | Cercana a 1.91:1 |
| Tamaño mínimo | 200 × 200 píxeles |
| Peso máximo | 8 MB |
Pasos
- Prepará la imagen. Armá una imagen de 1200 × 630 píxeles que pese menos de 8 MB y subila a tu web para que tenga su propia dirección.
- Pegá las etiquetas en el
<head>. Agregá este bloque dentro del<head>de tu página y cambiá los valores por los tuyos:<meta property="og:title" content="Tu título"><meta property="og:description" content="Tu descripción"><meta property="og:type" content="website"><meta property="og:url" content="https://tusitio.com/"><meta property="og:image" content="https://tusitio.com/og.png"> - Publicá los cambios. Subí la página actualizada a tu servidor o hosting.
- Probalo. Mandá el link de tu web por WhatsApp: tiene que aparecer la tarjeta con la foto y el título.
- Actualizá Facebook si hace falta. Facebook guarda los datos del link la primera vez que alguien lo comparte. Si cambiaste la imagen o el título y sigue mostrando lo viejo, pegá tu link en el Sharing Debugger para que los vuelva a leer.
- Revisá LinkedIn. Con Post Inspector ves cómo queda tu link en LinkedIn.
Si algo falla
- El link sigue saliendo sin tarjeta: revisá que las cuatro obligatorias (
og:title,og:type,og:image,og:url) estén dentro del<head>y que hayas publicado la versión nueva de la página. - La imagen no aparece: comprobá que mida al menos 200 × 200, que no pase los 8 MB y que
og:imagetenga la dirección completa, como en el ejemplo. - La imagen sale recortada: usá 1200 × 630, con proporción cercana a 1.91:1.
- En Facebook sale la imagen o el título anterior: pasá el link por el Sharing Debugger para que vuelva a leer los datos.
- En LinkedIn no se ve como esperabas: revisalo con Post Inspector.