Pubblicato il 05/07/12e aggiornato il

Il Mi Piace e la pagina di Facebook inseriti nel layout di Blogger.

Come inserire il Mi Piace della Pagina Fan di Facebook in una posizione fissa del layout e come installare il pulsante Condividi.
Nel precedente articolo abbiamo visto come si possano mostrare oggetti in determinate parti del layout. Questo è sempre possibile per le immagini ma non sempre lo è per bottoni, IFrame o altri oggetti più complessi come i banner pubblicitari.

Vediamo nel concreto come si possa visualizzare il Mi Piace della nostra pagina fan. Può essere una alternativa utile per coloro che non hanno lo spazio sufficiente per inserire il Like Box in una sidebar. E' sempre meglio creare una applicazione specifica per il nostro sito accedendo a Facebook Developers e andando su Crea applicazione.

Dopo averne digitato il nome e aver superato il controllo visivo dovremo incollare il dominio e l'URL del blog. Si va quindi in basso su Salva modifiche


applicazione-facebook

In alto sarà visibile l'ID univoco della applicazione. Per inserire il pulsante che permetta agli utenti di cliccare su Mi Piace della nostra pagina fan dovremo, dopo aver salvato il template, andare su Modello > Modifica HTML > Procedi e cercare la riga </body>. Subito sopra si incolla questo codice

<div style='position:absolute; left:50px;z-index:10;top:200px;'>
<iframe allowTransparency='true' frameborder='0' scrolling='no' src='//www.facebook.com/plugins/like.php?href=http%3A%2F%2Fwww.facebook.com%2Fideepercomputeredinternet&amp;send=false&amp;layout=button_count&amp;width=450&amp;show_faces=false&amp;action=like&amp;colorscheme=light&amp;font&amp;height=22&amp;appId=479289442099719' style='border:none; overflow:hidden; width:450px; height:22px;'/>
</div>

dove dovrà essere configurata la posizione mediante i parametri left:50px; top:200px;, inserito l'URL della pagina ufficiale al posto di ideepercomputeredinternet e sostituito l'ID della applicazione. I parametri del bottone possono essere personalizzati a piacere. Se si mantengono i parametri consigliati l'aspetto del pulsante sarà simile al primo di questo screenshot e avrà anche il contatore
pulsante-mi-piace-facebook

COME INSERIRE IL PULSANTE CONDIVIDI O SHARE SU FACEBOOK


Il secondo bottone con contatore si riferisce all'azione Condividi di Facebook. Utilizzando lo stesso procedimento, il codice da incollare per il pulsante Share stavolta diventa

<div style='position:absolute; right:50px;z-index:10;top:300px; '>
<div class='facebook-button'>
<a href='http://www.facebook.com/sharer.php' name='fb_share' type='box_count'>Condividi</a><script src='http://static.ak.fbcdn.net/connect.php/js/FB.Share' type='text/javascript'/>
</div>
</div>

in cui non sto a ripetere il solito discorso della configurazione della posizione. Quando ci si clicca sopra si aprirà una finestra popup del browser in cui condividere il post su Facebook e di cui sarà acquisita la miniatura della immagine. Si potrà anche aggiungere un commento prima di andare su Condividi link


demo-bottone-facebook

I bottoni del Mi Piace relativo alla Pagina fan e del Condividi sono rispettivamente a sinistra e a destra.




2 commenti :

  1. Ciao persifal, ho dei problemi da un po di giorni con il tasto condividi di facebook ... volevo allora sostituirlo con uno come il tuo che mette sia il mi piace che la condivisione ... come posso fare? Grazie!!!

    RispondiElimina
  2. Risolto, sempre grazie a un tuo articolo ... grazie per i tuoi articoli che sono sempre utilissimi!

    RispondiElimina

Non inserire link cliccabili altrimenti il commento verrà eliminato. Metti la spunta a Inviami notifiche per essere avvertito via email di nuovi commenti. Se ti ho aiutato con il post o con le risposte ai commenti condividi su Facebook o su Twitter. Grazie.