Corsi on-line

Aggiungere il bottone “Mi Piace” al proprio sito

Da qualche giorno il team di Facebook ha presentato una nuova ed interessante funzionalità che consente a tutti i webmaster di aggiungere il famigerato bottone "Mi Piace" sulle proprie pagine web al fine di consentire agli utenti di segnalarne il link alla loro rete di amicizie.

Il bottone "Mi Piace" (Like) è già molto familiare agli utenti di Facebook ma sino ad oggi era disponibile solo per le risorse interne del social network; da adesso non sarà più così. In questo post vedremo come aggiungere il bottone "Mi Piace" sulle pagine del nostro sito o blog.

La prima cosa da fare è visitare questa pagina che consente di generare dinamicamente il codice HTML (un <iframe>) da inserire sulle nostre pagine Web. Di seguito un esempio:

<iframe src="http://www.facebook.com/plugins/like.php?href=URL_PAGINA&layout=button_count&show_faces=false&width=150&action=like" scrolling="no" frameborder="0" allowTransparency="true" style="border:none; overflow:hidden; width:150px; height:25px"></iframe>

Ovviamente dovete personalizzare il codice mettendo la URL della vostra pagina come attributo del parametro href=.

Fatto questo il bottone sarà già funzionante. Se, tuttavia, vogliamo personalizzare ulteriormente possiamo aggiungere questi meta-tag alla nostra pagina web:

<meta property="og:title" content="Titolo del post"/>
<meta property="og:site_name" content="Mr.Webmaster - Blog"/>
<meta property="og:image" content="http://blog.mrwebmaster.it/fbicon.jpg"/>

Di seguito la spiegazzione dei meta-tag utilizzati:

  • og:title – inserire un titolo per la pagina che ne riassuma il contenuto;
  • og:site_name – inserire il titolo del sito;
  • og:image – la URL di un’immagine (minimo 50×50 pxl) relativa al contenuto;

Nota: se utilizzate WordPress potete scaricare ed installare questo nuovo plug-in.

Post correlati
  • christian

    Salve sarebbe possibile creare il pulsante su ogni singolo prodotto di uno shop creato con virtuemart?
    Grazie

  • Massimiliano Bossi

    Sì, certo. Puoi inserirlo tu stesso oppure cercare qualche plug-in ad hoc.

  • Carmelo

    Salve. Il post è vecchio ma spero mi rispondiate lo stesso. Sappiate che vi seguo spesso e siete numeri uno.

    Ho provato spesso ad inserire questo codice nelle pagine dei siti che faccio. Funziona bene, tranne che per una cosa. Quando poi clicco per condividere, non mi fa vedere mai l’immagine principale, ad esempio del post, ma invece mi fa vedere quelle che ci sono magari nella sidebar.

    Come posso risolvere? Sto uscendo pazzo…

  • maxbossi

    Devi utilizzare i meta-tag di Facebook (Open-Graph) e specificare qual’è l’immagine di riferimento del post. Ciao

  • Carmelo

    ho fatto esattamente cosi, ma continua a non farmi vedere l’immagine che gli suggerisco io. Ovviamente inserisco il percorso assoluto (es. http://www.nomesito.it/img/nome_immagine.jpg) ma continua imperterrito a visualizzare tutte le immagini tranne quella che vorrei… Ma com’è possibile?

I più letti del mese
Tematiche