Pulsanti per condividere su Facebook, Twitter o Google Buzz con immagini personalizzate per Blogger

Sembra che i pulsanti per condividere gli articoli su Facebook, Twitter e Google Buzz siano stati molto apprezzati e così ho deciso di pubblicare il codice da inserire nel template, anche per dare la possibilità, a chi volesse, di testare se effettivamente il rendimento cambia rispetto alla classica pletora di mini bottoni in fondo al post, come discusso in uno dei ultimi articoli, senza dover fare troppo lavoro per crearseli da sè.

Avrei potuto farvela più breve con uno script esterno, ma vi propongo direttamente il codice HTML così chi vorrà personalizzare le immagini potrà farlo liberamente. Tranquilli che si tratterà comunque solo di un copia e incolla.

Come sempre ricordo di fare un backup del template in modo da poter tornare indietro senza problemi e, se non vi sentite sicuri, di fare prima l’esperimento su un blog di prova.

Modifichiamo il template

Dalla bacheca, andate in Design –> Modifica HTML, selezionate “Espandi i modelli widget” e cercate queste righe di codice:

<data:post.body/>
<div style='clear: both;'/> <!-- clear for photos floats -->

Al solito, potrebbero essere leggermente diverse. Il vostro riferimento deve essere post.body o clear for photos floats.

Subito sotto, incollate il seguente codice:

<!-- codice pulsanti facebook, twitter e Buzz - inizio -->
<b:if cond='data:blog.pageType == &quot;item&quot;'>
<div style='text-align:left;'>
<br/>
<small>Condividi su Facebook, Twitter o Google Buzz:</small>
<br/>

<a expr:href='&quot;http://www.facebook.com/sharer.php?u=&quot; + data:post.url + &quot;&amp;t=&quot; + data:post.title' target='_blank' title='Condividi su Facebook'><img alt='Condividi su Facebook' src='http://tinyurl.com/38cvx84'/></a>

<a expr:href='&quot;http://twitthis.com/twit?url=&quot; + data:post.url' target='_blank' title='Condividi su Twitter'><img alt='Condividi su Twitter' src='http://tinyurl.com/2vzxxvg'/></a>

<a expr:href='&quot;http://www.google.com/buzz/post?url=&quot; + data:post.url' target='_blank' title='Pubblica su Google Buzz'><img alt='Pubblica su Google Buzz' src='http://tinyurl.com/38vvb59'/></a>

<br/>
</div>
</b:if>
<!-- codice pulsanti facebook, twitter e Buzz – fine -->

E salvate il template. Visualizzando il blog, nella pagina del singolo post vedrete già i nuovi pulsanti così come li ho usati io.

Se volete che i pulsanti siano visualizzati anche nella pagina principale del blog, eliminate le due righe che ho evidenziato in verde. Se volete personalizzare le immagini dei tre servizi, basta cambiare le parti in rosso sostituendole con gli indirizzi di quelle che volete usare rispettivamente per Facebook, Twitter e Google Buzz.

Rimuovere i pulsanti

Se dopo averli provati deciderete di toglierli, basterà tornare in Design –> Modifica HTML, selezionare “Espandi i modelli widget” e eliminare tutte il codice compreso tra:

<!-- codice pulsanti facebook, twitter e Buzz - inizio –>

e:

<!-- codice pulsanti facebook, twitter e Buzz – fine -->

Per concludere

Se provate i nuovi pulsanti fatemi sapere se noterete delle differenze nel tempo, se notate un maggior traffico da Facebook o una maggiore condivisione dei vostri articoli.

Vista la sudata che mi sono fatto per scrivere quest’articolo, che ne direste di cominciare a condividere proprio questo?

Ulteriori approfondimenti:

• Social network a cui segnalare i post: meglio pochi ma buoni
• Blogger integra i pulsanti per la condivisione dei post su Facebook, Twitter e Buzz
• Inserire un pulsante nel blog per condividere gli articoli su Facebook, con contatore delle segnalazioni fatte
• Adesso è possibile notificare i nuovi post del blog su Twitter direttamente con FeedBurner
• Come aggiungere un pulsante per segnalare su Twitter (Retweet) i post del blog, con contatore delle segnalazioni fatte
• Social news italiani, funzionano? Alcuni servizi a confronto

Condividi su Facebook, Twitter o Google Buzz:

Per ricevere direttamente in posta i nuovi articoli, inserisci il tuo indirizzo email:

oppure puoi iscriverti al feed per tenerti sempre aggiornato sui nuovi contenuti del blog!
Per maggiori informazioni sui feed, clicca qui!