Pulsante di condivisione Facebook personalizzato con titolo, URL e immagine personalizzati in WordPress

Question

Pulsante di condivisione Facebook personalizzato con titolo, URL e immagine personalizzati in WordPress

27 ago 2014, 10:12:56

Visualizzazioni: 40.4K

Voti: 1

Nella mia pagina con tutti i post c'è un pulsante di condivisione (tramite plugin AddThis).

Quando clicco per condividere su Facebook, prende l'URL e il titolo, ma mostra un'immagine diversa. Per esempio.

Ho provato a creare un pulsante di condivisione personalizzato come quello qui sotto, ma quando ci clicco sopra non succede nulla.

  <?php
    $title = the_title();
    $url= the_permalink();
    $summary=urlencode('Messaggio personalizzato che riassume il contenuto della tua scheda, o semplicemente un messaggio per invitare le persone a controllare la tua scheda.');
    $image= wp_get_attachment_image_src( get_post_thumbnail_id( $post->ID ),  'single-post-thumbnail' );
  ?>
    <a onClick="window.open('http://www.facebook.com/sharer.php?s=100&amp;p[title]=<?php echo $title;?>&amp;p[summary]=<?php echo $summary;?>&amp;p[url]=<?php echo $url; ?>&amp;&p[images][0]=<?php echo $image[0];?>', 'sharer', 'toolbar=0,status=0,width=548,height=325');" target="_parent" href="javascript: void(0)">
        Condividi su Facebook personalizzato!
    </a>

Ho anche inserito i tag Open Graph nel mio header.php tra i tag <head>:

<?php $image = wp_get_attachment_image_src( get_post_thumbnail_id( $post->ID ), 'single-post-thumbnail' ); ?>
<meta property="og:title" content="<?php the_title(); ?>" /> 
<meta property="og:description" content="" />  
<meta property="og:image" content="<?php echo $image[0]; ?>" /> 
<meta property="og:video" content="" /> 
<meta property="og:video:width" content="560" />  
<meta property="og:video:height" content="340" />  
<meta property="og:video:type" content="application/x-shockwave-flash" />

Tutti i post del mio sito web dovrebbero essere condivisibili su Facebook e Twitter con il loro URL, titolo, immagini e descrizione. Qui c'è un link di riferimento funzionante.

user3209031

121

personalizzazione facebook

Tutte le risposte alla domanda

Che ne dici di utilizzare la variabile u per condividere il tuo URL e permettere a Facebook di ottenere il contenuto utilizzando i tag Opengraph?

Qualcosa come questo

<a onClick="window.open('http://www.facebook.com/sharer.php?u=<?php echo $url; ?>', 'sharer', 'toolbar=0,status=0,width=548,height=325');" target="_parent" href="javascript: void(0)">Condividi su Facebook personalizzato!</a>

Carlos Faria

487

27 ago 2014 10:29:40

Commenti

hey grazie per favore controlla il mio link di riferimento aggiornato.. intendo il sito web che utilizza queste funzionalità

user3209031

27 ago 2014 10:32:01

hey come hai detto ho fatto così.. ma ancora non funziona, per favore controlla il link demo

user3209031

27 ago 2014 10:36:09

user3209031 121 · Accepted Answer · 2014-08-27T13:29:59Z

Dopo aver cercato a lungo qui e là, ho finalmente trovato la soluzione per quanto sopra:

Ho sostituito il meta tag precedente con quello che segue

<?php if ( have_posts() ) while ( have_posts() ) : the_post(); ?>

<?php $image = wp_get_attachment_image_src( get_post_thumbnail_id( $post->ID ), 'single-post-thumbnail' );  ?>

<?php if($image[0] != "" ){ ?>

<meta property="og:image" content="<?php echo $image[0]; ?>"  >

<?php } else { ?>

<meta property="og:image" content="logo.png"  >

<?php } ?>


<meta property="og:image:width" content="3523" >

<meta property="og:image:height" content="2372" >

<meta property="og:url" content="<?php echo the_permalink(); ?>"  >

<meta property="og:title" content="<?php echo the_title(); ?>"  > 

<meta property="og:site_name" content="Thefansworld" />

<meta property="og:description" content="" >  

<meta property="fb:app_id" content="3668661019" >

<meta property="fb:admins" content="" >

 <?php endwhile; wp_reset_query(); ?>

Ma alcuni POST continuano a mostrare immagini sbagliate e dopo alcune ricerche ho scoperto:

Quando Facebook recupera una pagina web da un URL, ne memorizza il contenuto nella cache per un uso successivo. Ciò significa che se Facebook recupera i dati dal tuo sito una volta e poi il tuo sito cambia (ad esempio cambiano i tag og:image), Facebook non cambierà l'immagine perché ha già tutto memorizzato nella sua cache.

Prova a visitare la pagina Facebook Debugger e verifica cosa "vede" Facebook. Utilizzare questo strumento forza Facebook ad aggiornare i dati dall'URL specificato. Questo è il modo migliore per eseguire il debug.

Quando ti assicuri che Facebook "veda" i tag og:image corretti, assicurati che le immagini nei tag og:image abbiano una larghezza/altezza minima adeguata (tutto è spiegato nel debugger di fb).

Facebook non utilizzerà un'immagine da og:image se non soddisfa i criteri di FB. Consiglio vivamente questo strumento ogni volta che ci sono problemi con il contenuto del tuo sito su FB.

Spero che questo possa aiutare qualcuno. E se ho sbagliato qualcosa, fatemelo sapere :)