Pulsante per invitare gli amici di Facebook a visitare il blog.

Come installare su Blogger un bottone per dare la possibilità ai lettori di invitare gli amici a visitare il nostro sito.

La stragrande maggioranza dei lettori dei blog hanno anche un account Facebook con una media di 150-200 amici per ciascuno. Se un navigatore ritiene utili i contenuti di un sito web perché non dargli la possibilità di condividere questo apprezzamento con una parte o con tutti i suoi amici di Facebook? Ecco quindi che Facebook ha reso disponibile per gli utenti quello che forse è uno dei modi più efficaci per aumentare le visite al sito.

Si può infatti installare nel blog un pulsante su cui i lettori possono cliccare e che aprirà una finestra popup in cui potranno invitare tutti gli amici che vorranno e che riceveranno una notifica in tal senso nella sezione Richieste. Per evitare abusi Facebook ha messo il limite di 50 inviti per volta ma dopo aver fatto il primo invito a 50 persone se ne può fare un altro ad altre 50 e così via.

La condizione per l'inserimento di questo pulsante è la creazione di una applicazione Facebook che può essere fatta accedendo alla pagina Facebook Developers. Se non avete mai verificato il vostro account con un codice inviato per SMS non vi sarà data possibilità di creare una applicazione. Bisogna creare una applicazione per ciascun sito che si gestisce in quanto il suo funzionamento è legato al dominio su cui opera. Andate su Crea applicazione se non ne avete ancora una per il vostro blog. Se invece la avete già creata andate su Edit Setting per verificare che sia tutto a posto

E' fondamentale inserire l'URL in App Domains e in Website with Facebook Login e quindi salvare le modifiche. Il primo URL va messo senza http iniziale mentre nel secondo va inserita anche questa parte. In App Domain ho dovuto mettere il suffisso .it perché con .com non funzionava ma potrebbe essere stato un caso. Il dato che ci interessa è quello del codice identificativo della applicazione (App ID).

Si va su Layout > Aggiungi un gadget > HTML/Javascript e si incolla il seguente codice

<style>
.bottone_invito a{
font-family: "lucida grande", tahoma, verdana, arial, sans-serif ! important;
    font-weight:bold ! important;
    font-size:12px ! important;
    width:150px ! important;
    border:solid #29447e 1px ! important;
    border-bottom:solid #1a356e 1px ! important;
    cursor:pointer ! important;
    padding:6px 6px 6px 6px ! important;
    background-color:#5c75a9 ! important;
    border-top:solid #8a9cc2 1px ! important;
    text-align:center ! important;
    color:#fff ! important;
text-decoration:none  ! important;
}
.bottone_invito a:active{
    background-color:#4f6aa3;
}
</style>
<script src="http://connect.facebook.net/it_IT/all.js"></script>
<script>FB.init({
appId:'479289442099719',
cookie:true,
status:true,
xfbml:true
});
function FacebookInviteFriends()
{
FB.ui({
method: 'apprequests',
message: 'Invita i tuoi amici a visitare questo blog se lo ritieni interessante'
});
}
</script>
<div id="fb-root"></div>
<span class="bottone_invito"><a href='#' onclick="FacebookInviteFriends();">
Invita i tuoi amici di Facebook</a></span>
<script type='text/javascript'>
if (top.location!= self.location)
{
top.location = self.location
}
</script>

Si salva dopo aver opzionalmente inserito anche un titolo. Il bottone avrà questo aspetto



e quando qualcuno ci cliccherà sopra vedrà aprirsi questa finestra popup

in cui si potranno invitare fino a 50 amici per volta a visitare il sito in oggetto. Le espressioni colorate di rosso possono essere personalizzate a piacere. Quello che è fondamentale è di mettere il codice numerico di App ID. Se avete già nel modello il javascript di Facebook per non doverlo inserire tutte le volte che installate un nuovo plugin, potete tralasciare la riga evidenziata di giallo. Nel caso che abbiate un sito di dimensioni internazionali al posto di it_IT dovrete mettere en_US per avere la grafica in inglese

Aggiornamento: Mi è stato riferito in un commento che questo widget provoca dei problemi nell'accesso a Blogger e nella visualizzazione di altri widget del blog. Se riscontrate queste problematiche eliminate il gadget.