Mail: orangedropdesign@gmail.com / Mobile: +39 338.6213493

Facebook Open Graph

Come impostare un’immagine di anteprima per un link su Facebook

Dopo aver imprecato in diverse lingue e aver inventanto anche nuove divinità sacrificabili a tale scopo sono riuscito, grazie alla documentazione (che siano sempre lodati gli sviluppatori seri…) a capire come obbligare Facebook a mostrare una immagine di anteprima per i link che vengono postati.

La risposta arriva dalle Open Graph di Facebook.

Senza scendere troppo in tecnicismi passiamo a quello che ci serve veramente, il codice:

<link rel="image_src" src="[url_immagine]" />

dove [url_immagine] sta per l’indirizzo dell’immagine scelta per anteprima del link su Facebook.

Questo semplice codice va inserito nell’head della pagina web e fornisce l’indicazione allo script Facebook quando incollate il link.

Come integrarlo con WordPress

Integrare questo codice con WordPress dovrebbe essere relativamente semplice. Soprattutto se è stata impostata una immagine in evidenza per l’articolo (o sezione del sito che si voglia).

Basta inserire al posto della [url_immagine] la funzione the_post_thumbnail() di WordPress. Eventuali specifiche di questa funzione sono definite nello specifico file di WordPress, dal quale potrete decidere dimensioni e caratteristiche dell’immagine.

Inserendo quindi questo codice nell’header.php del template WordPress avrete impostata l’immagine di anteprima per l’articolo del vostro blog.

  1. Ciao Andrea, articolo molto interessante. I misteri delle anteprime di Facebook ha reso pazze molte persone :D Questo metodo è sicuramente il più efficiente in circolazione, però penso che sia sempre meglio rispettare le regole di base, ovvero impostare i “meta tag” che mette a disposizione FB, no?
    Mentre per quanto riguarda l’inserimento dell’immagine c’è la possibilità di usare una funzione/plugin che si chiama GET THE IMAGE, che ti permette di scegliere l’immagine da visualizzare attraverso i custom meta. Se non esiste un immagine Custom allora prende quella dei Post Thumbnail.

    Grazie dell’articolo ;)

    • Come per ogni cosa ci sono diverse metodologie e tecniche e questa e` solo una di quelle ovviamente.
      Il processo e` ovviamente generalista e vale per ogni tipo di sito (anche per chi vuole una immagine standard per tutto il sito tipo un logo…) e WordPress e` un caso particolare che, se vuole essere implementato a livello di tema, puo` sfruttare questo codice.
      Grazie per il commento!

Lascia una risposta