Toolbar di AddThis per condividere i post su tutti i social.

Come inserire la toolbar di AddThis nella parte alta delle pagine di Blogger per condividere i post in centinaia di social network e social bookmarking.

Dopo aver presentato i bottoni di condivisione nelle immagini del post passo a illustrare un altro interessante widget di AddThis. Si tratta di una toolbar che appare nella parte alta della pagina nel momento in cui si inizia lo scroll del post.

Vengono visualizzati i bottoni di una dozzina di social network più la classica icona More di AddThis che consente di condividere la pagina in altre centinaia di servizi

Per poter accedere alle statistiche di condivisione tramite i bottoni di AddThis è opportuna procedere a una registrazione gratuita. Si potrà quindi conoscere l'ID del nostro Profilo per poterlo aggiungere allo script. Gli ID sono visibili nella pagina Publisher Profiles.

Si possono mostrare fino a 17 icone ma in questo caso si disporranno su tre file

Per l'installazione, dopo aver salvato il template, si va su Modello > Modifica HTML > Procedi. Si cerca la riga </head> e, subito sopra, si incolla il codice seguente

<script type='text/javascript'>
var addthis_config = {
    bar_show_below : 150
}
</script>
<script src='http://s7.addthis.com/js/300/addthis_widget.js#pubid=ra-4ffad8a708febd2c' type='text/javascript'/>

dove al posto della stringa alfanumerica in rosso inserite il vostro ID di AddThis. Cercate quindi la riga </body> e, subito sopra, incollate quest'altro codice

<div class='addthis_bar addthis_bar_medium'>
<label>Condividi questa pagina:</label>
<div class='addthis_toolbox addthis_default_style addthis_32x32_style'>
<span><a class='addthis_button_preferred_1'/></span>
<span><a class='addthis_button_preferred_2'/></span>
<span><a class='addthis_button_preferred_3'/></span>
<span><a class='addthis_button_preferred_4'/></span>
<span><a class='addthis_button_preferred_5'/></span>
<span><a class='addthis_button_preferred_6'/></span>
<span><a class='addthis_button_preferred_7'/></span>
<span><a class='addthis_button_preferred_8'/></span>
<span><a class='addthis_button_preferred_9'/></span>
<span><a class='addthis_button_preferred_10'/></span>
<span><a class='addthis_button_preferred_11'/></span>
<span><a class='addthis_button_preferred_12'/></span>
<span><a class='addthis_button_preferred_13'/></span>
<span><a class='addthis_button_preferred_14'/></span>
<span><a class='addthis_button_preferred_15'/></span>
<span><a class='addthis_button_preferred_16'/></span>
<span><a class='addthis_button_compact'/></span>
<span><a class='addthis_counter addthis_bubble_style'/></span>
</div>
</div>

dove ho inserito tutti e 17 i bottoni e il testo Condividi questa pagina che naturalmente può essere modificato. Ciascun elemento che inizia con <span> e termina con </span> rappresenta un bottone. La corrispondenza non è però univoca. Per inserire solo una riga di pulsanti si utilizza questo codice

<div class='addthis_bar addthis_bar_medium'>
<label>Condividi questa pagina:</label>
<div class='addthis_toolbox addthis_default_style addthis_32x32_style'>
<span><a class='addthis_button_preferred_1'/></span>
<span><a class='addthis_button_preferred_2'/></span>
<span><a class='addthis_button_preferred_3'/></span>
<span><a class='addthis_button_preferred_4'/></span>
<span><a class='addthis_button_compact'/></span>
<span><a class='addthis_counter addthis_bubble_style'/></span>
</div>
</div>

Si salva il modello dopo aver visualizzato l'anteprima. I pulsanti saranno visualizzati secondo un ordine basato sulle ultime condivisioni.

Se si clicca su More ovvero sulla icona che sembra la bandiera svizzera, si apre una finestra per condividere il post su tutti i servizi possibili e immaginabili

I vari social possono anche essere cercati digitando il loro nome nell'apposita barra di ricerca.