Come mostrare il Like Box di Facebook con bordi e ombre.

Come installare su Blogger e su Wordpress il Like Box (o Fan Box) di Facebook con arrotondamenti, ombreggiature e colore di sfondo personalizzati.

In linea di massima per installare i plugin di Facebook nel nostro sito ci vuole una trafila non semplicissima che parte dalla creazione di una applicazione specifica fino all'inserimento nel template dei metatag e di uno script che fanno parte dello strumento denominato Open Graph. 

I plugin di Facebook però non sono tutti uguali. Mentre il modulo dei commenti è uno dei più complessi da inserire il cosiddetto Fan Box o Like Box di Facebook che mostra gli avatar delle persone che si sono iscritti cliccando sul Mi Piace è decisamente più semplice da installare visto che non ha bisogno di alcuna applicazione ma solo del javascript. In questo post  vediamo come si possa mostrare nel nostro blog di Blogger o di Wordpress con un aspetto un po' particolare con bordi arrotondati e ombreggiature.

Il codice da utilizzare è il seguente

<div align='center'>
<div style="-moz-box-shadow: 0px 15px 20px 0px #777; -webkit-box-shadow: 0px 15px 20px 0px #888; background-color: #f4f4f4; border-radius: 15px; border: 1px solid #CCC; box-shadow: 0px 15px 20px 0px #666; height: 280px; margin: 5px; padding: 10px 0 10px 10px; width: 280px;"><div style="height: 280px; overflow: hidden;"><iframe src="http://www.facebook.com/plugins/likebox.php?href=https://www.facebook.com/ideepercomputeredinternet&amp;width=250&amp;height=258&amp;show_faces=true&amp;header=false&amp;stream=false&amp;show_border=false" scrolling="no" frameborder="0" style="border:none; overflow:hidden; width:250px; height:258px;" allowtransparency="true"></iframe>
</div>
</div>
</div>

dove si possono modificare i parametri ma soprattutto va sostituito l'URL della pagina Facebook di questo blog colorato di viola con l'URL della vostra pagina. Le dimensioni del widget hanno più occorrenze nel codice quindi se si pensa di cambiarle va fatto non con una soltanto. Si possono adattare anche il raggio di curvatura degli arrotondamenti e i codici dei colori di sfondo e ombreggiature.

Per installare il Like Box su Blogger si va su Layout > Aggiungi un gadget > HTML/Javascript e si incolla il codice in Sezione del sito. Si salva e si posiziona. Il widget avrà questo aspetto

Con Wordpress invece si va su Aspetto > Widget e si trascina  Testo in una sidebar o nel footer



Si incolla il codice precedente e si va su Salva quindi su Chiudi.



Il widget avrà nei siti Wordpress lo stesso aspetto che ha su Blogger.