¿Cómo puedo controlar la imagen me gusta de Facebook? [cerrado]

La imagen que se usa para compartir se toma de una parte del código en el encabezado de su sitio que se verá así:

<link rel="image_src" href="path/to/theme/screenshot.png" />

Normalmente, se vincula a la captura de pantalla de su sitio en el tema. Si eliminó el código del encabezado del archivo y en single.php, colóquelo dentro del bucle y llamó su imagen en miniatura del mensaje al elemento href, creo que funcionaría. Así se vería algo así como:

<link rel="image_src" href="<?php the_post_thumbnail(); ?>" />

Esto significaría que si tiene botones similares en las páginas que enumeran varias publicaciones, probablemente no tendrá una imagen. Si incluyó algún código condicional que lo eliminó solo en single.php, tendría la imagen normal en cualquier página con varias publicaciones y un botón similar y la miniatura de publicación cuando se use la plantilla de single.php. Entonces el código del encabezado sería:

<?php if ( is_single() ) { /* do nothing on single pages */ } else { ?>
<link rel="image_src" href="path/to/theme/screenshot.png" />
<?php } ?>

Entonces seguirías usando el código para incluir la miniatura de la publicación en single.php.

Facebook ahora usa el protocolo opengraph. Puedes agregar imágenes usando:

<meta property="og:image" content="http://YOUR_IMAGE_URL" />

Añade esta línea al encabezado de tu página.

Alternativamente, puedes usar mi complemento para hacer esto automáticamente.

Simplemente hace este trabajo y no se necesitan configuraciones.

enlace

Necesitas usar el protocolo Open Graph de Facebook. No estoy seguro de por qué la respuesta aceptada no es una de las muchas OG: respuestas relacionadas (que he votado) pero está mal.

enlace

Puede personalizar muchas cosas, incluidos el título, la imagen, la descripción, la categoría, la última actualización, etc., si utiliza Open Graph. Si utiliza estas otras soluciones a medias, falta la imagen completa.

Si no seguía el protocolo OG para todo el trabajo de FB que hago, me despedirían.

Si haces lo siguiente:

<link rel="image_src" href="<?php the_post_thumbnail(); ?>" />

Encontrará que Wordpress genera el html requerido para mostrar la imagen, no solo el SRC, que es lo que realmente desea.

Haciendo algo como:

<?php

// Featured Image for FB Like
$feature_image = get_the_post_thumbnail($post->ID);

// Get image source
$doc = new DOMDocument();
$doc->loadHTML($feature_image);
$imageTags = $doc->getElementsByTagName('img');

foreach($imageTags as $tag) {
        $image_url = $tag->getAttribute('src');
    }
?>
<link rel="image_src" href="<?php echo $image_url; ?>" />

te da la URL solamente. Probablemente sea el camino más largo y probablemente se pueda acortar, pero definitivamente soluciona el problema.

Espero que esto te ponga en el camino correcto.

Matt.

Asegúrate de que la URL esté llena de pelusas aquí si la imagen especificada no aparece correctamente:

enlace

Si desea utilizar la primera imagen de su publicación como miniatura con una alternativa a su logotipo, pruebe mi complemento - enlace La explicación para agregar la imagen del logotipo de respaldo se encuentra en enlace

<meta property="og:image" content="http://YOUR_IMAGE_URL" />

Este método funciona para "me gusta": s, pero más adelante, si desea compartir un enlace en su registro (por ejemplo), esta imagen se selecciona automáticamente.

Sin esta etiqueta meta, puedes seleccionar de todas las imágenes en el sitio vinculado.

¿Alguien sabe alguna manera de mantener la imagen estática "como" pero aún así te hace elegir una imagen cuando compartes una url?

OK, escribí un poco de javascript para rellenar la imagen de Meta og: con la imagen destacada de mi elección. Es un truco de una sola vez que agrega a su archivo de encabezado.

En mi publicación de WordPress, agrego la ID "Featured-image" (Sé que con WordPress posterior está incorporada, estoy en una antigua).

<xmp><img src="http://mysite.com/catphoto.jpg"id="featured-image" /></xmp>

Escribo una etiqueta meta para la imagen og: con un marcador de posición, como el registro de mi blog. Agregue "id=" meta-imagen "a la etiqueta, es decir,

<meta property="og:image" src="http://mysite.com/logo.jpg"id="meta-image" />

Luego agrega este javascript en el encabezado:

<script type="text/javascript" src="http://code.jquery.com/jquery-1.7.1.min.js"></script><scripttype="text/javascript">
$(document).ready( function(){
    var featured_image = $("#featured-image").attr("src");
    $('meta[property="og:image"]').attr("content",featured_image);
});