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

12

Tengo un blog con algunas publicaciones, y cada publicación tiene un botón de Me gusta incrustado en Facebook. Al presionar el botón se abre un cuadro de diálogo para que mis visitantes puedan compartir la publicación en Facebook con un comentario.

Sin embargo, al compartir, la imagen seleccionada por Facebook es un ícono de correo genérico y no la miniatura de la publicación.

¿Cómo puedo controlar la imagen que se utiliza al compartir?

    
pregunta hannit cohen 03.11.2010 - 21:13

8 respuestas

7

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.

    
respondido por el curtismchale 04.11.2010 - 16:04
11

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

    
respondido por el mattsay 19.03.2011 - 10:40
5

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.

    
respondido por el bitwit 14.10.2011 - 23:07
1

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.

    
respondido por el user4050 19.03.2011 - 00:36
1

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

enlace

    
respondido por el Justin Burrow 27.07.2011 - 20:18
0

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

    
respondido por el Ashfame 19.03.2011 - 08:57
0
<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?

    
respondido por el Yo-L 16.08.2011 - 16:18
0

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);
});
    
respondido por el Anna Billstrom 06.03.2012 - 08:35

Lea otras preguntas en las etiquetas