Herramienta de vista previa de gráfico abierto

\n\n\n\n\n`; }, copy(){ navigator.clipboard.writeText(this.tags); this.copied=true; setTimeout(()=>this.copied=false,1500); } }">

Title

Description

Image URL

Page URL

Preview (Facebook/LinkedIn style)

Open Graph tags

Share X / Twitter Facebook LinkedIn WhatsApp

Cómo usar Abrir herramienta de vista previa de gráficos

Complete el título, la descripción, la URL de la imagen y la URL de la página.
Observe la vista previa de la tarjeta compartida: itere hasta que se vea bien.
Copia las metaetiquetas en el de tu página: valores únicos por página.
Después de la publicación, verifica en vivo y actualiza los cachés de la plataforma (depurador de Facebook) si la página se compartió antes.

¿Cuál es Abrir herramienta de vista previa de gráficos?

Una herramienta de vista previa de Open Graph muestra cómo se verá la tarjeta compartida de un enlace (el título, la descripción y la imagen que aparecen cuando su página se publica en Facebook, X, LinkedIn, WhatsApp o Slack) y genera las metaetiquetas para producirla. Usted diseña la tarjeta visualmente y copia el código, en lugar de publicarlo y esperarlo.

Las etiquetas Open Graph controlan la vista previa del enlace desplegado, y hacerlo bien es de gran influencia: una tarjeta atractiva con una imagen potente genera muchísimo más clics que una URL simple o una vista previa rota. La vista previa antes del envío detecta los problemas (imagen incorrecta, título truncado, etiquetas faltantes) que de otro modo te avergonzarían en el feed de alguien.

Sobre el Abrir herramienta de vista previa de gráficos

Complete el título, la descripción, la URL de la imagen y la URL de la página, mire la actualización de la vista previa de la tarjeta compartida y copie las metaetiquetas completas de Open Graph (y Twitter Card) para el de su página.

Lo que la vista previa le enseña a comprender correctamente: la imagen: 1200 × 630 es el estándar multiplataforma y debe ser una URL https absoluta (las rutas relativas son la principal razón por la que las imágenes no se muestran); el título: contundente, ~60 caracteres para que no se trunque y puede diferir de su título SEO (escríbalo para el feed); la descripción: ~2 líneas de gancho (~110 caracteres visibles en la mayoría de las plataformas); y integridad: la vista previa muestra lo que falta antes de que las plataformas reales muestren una tarjeta simple.

El flujo de trabajo: diseñe la tarjeta aquí, pegue las etiquetas en cada página que se puede compartir (cada una con sus propios valores; una tarjeta idéntica en todo el sitio hace que cada enlace parezca la página de inicio), luego, después de publicar, verifique la página en vivo y actualice los cachés de la plataforma (Facebook Sharing Debugger, LinkedIn Post Inspector), ya que las plataformas realizan vistas previas agresivas del caché: una página compartida antes de que sus etiquetas fueran correctas mantiene la tarjeta rota hasta que se fuerza. para volver a raspar. Nuestro Open Graph Checker verifica las etiquetas activas; esta herramienta los diseña.

Preguntas Frecuentes

1200×630 (1,91:1): el estándar multiplataforma, nítido en Facebook, LinkedIn, X y WhatsApp. Mantenga la clave visual centrada (algunos cultivos son cuadrados), use una URL https absoluta y manténgase por debajo de ~5 MB.

La mayoría de las veces, una URL de imagen relativa en lugar de absoluta: og:image debe ser una dirección https://… completa. Otras causas: imagen demasiado pequeña, bloqueada por robots o la plataforma almacenó en caché una versión anterior (actualice con su depurador).

Sí, og:title está separado de la etiqueta <title>, así que ajústelo para las redes sociales (curiosidad, sin sufijo de marca) mientras la etiqueta de título apunta a la búsqueda. Dos audiencias, dos titulares, misma página.

Almacenamiento en caché de plataforma. Facebook/WhatsApp: pegue la URL en el Depurador de uso compartido y "raspe de nuevo". LinkedIn: inspector de publicaciones. X se actualiza en unos días. La solución está activa; el caché sólo necesita un empujón.

Cada página que se puede compartir, con valores específicos de la página; de lo contrario, cada enlace compartido muestra la misma tarjeta (generalmente la página de inicio). Los CMS los generan por página automáticamente; Los sitios personalizados utilizan herramientas como esta para crearlos por página.