Cómo obtener vista previa en miniatura de tu web para Facebook Share

Cuando alguien comparte un enlace a una de tus páginas en su muro, Facebook obtiene automáticamente una imagen de la página enlazada y la muestra junto al nombre y URL. Desafortunadamente, la imagen obtenida a veces no tiene relación con el contenido o falta completamente. Para asegurar que Facebook muestre la mejor imagen posible al compartir tu página —y así aumentar la tasa de clics (CTR)— añade unas líneas de código al HTML de la página para forzar a Facebook a obtener una imagen específica.

Añadir marcado Open Graph

Open Graph es un protocolo de Facebook que, entre otras funciones, permite a desarrolladores añadir etiquetas de marcado a sus páginas para personalizar cómo Facebook muestra enlaces a sus sitios.

Añade etiquetas Open Graph editando el código HTML fuente:

Paso 1: Editar HTML

Abre el archivo HTML en un editor de texto (Bloc de notas) o editor HTML dedicado. Sitúa el cursor antes de la etiqueta de cierre </head> cerca del inicio y pulsa Entrar para crear nueva línea.

Paso 2: Añadir meta tag de imagen

Introduce la siguiente meta etiqueta:

<meta property="og:image" content="https://www.tusitio.com/miniatura.jpg" />

Sustituye https://www.tusitio.com/miniatura.jpg por el enlace real de la imagen que quieres que muestre Facebook al compartir tu sitio.