Come aggiungere il bottone con contatore di Pinterest e il pulsante per essere seguiti nel modello di Blogger .

I guru del web sono quasi tutti concordi nel ritenere che Pinterest rappresenti il social network del futuro. Specialmente nei siti di lingua inglese non passa giorno che non ci siano articoli dedicati a come migliorare la propria esperienza su Pinterest e a ottimizzare le sinergie tra questo social di immagini e il proprio sito o la nostra attività online.

Il team di sviluppatori di Pinterest ha reso noto da poche ore che implementerà un codice per rendere impossibile condividere le foto da quei siti che non vogliono dare questa opportunità. E' evidente infatti che l'acquisizione di immagini pone problemi di copyright non da poco e quelli di Pinterest vogliono proteggersi da eventuali azioni legali. E questo succede nonostante il servizio sia ancora in Beta e a inviti, cosa accadrà quando sarà aperto a tutti?

Dopo aver presentato un bottone per la condivisione su Pinterest delle foto del nostro sito che poteva essere inserito indifferentemente in una sidebar o nel codice del modello, presento tre nuove versioni del bottone di Pinterest con queste caratteristiche

1. In due di queste sarà visibile anche il contatore dei Pin ricevuti che invece mancava nel precedente bottone
2. Potrà essere inserito solo all'interno del modello di Blogger
3. Si potrà scegliere lo stile modificando l'attributo di count-layout

Il codice da incollare nel template è il seguente

<!-- PulsantePinterest Inizio -->
<b:if cond='data:blog.pageType == &quot;item&quot;'>
<b:if cond='data:post.thumbnailUrl'>
<div id='pin-wrapper' style='margin:5px 10px 5px 0; text-align: left;'>
<a class='pin-it-button' count-layout='horizontal' expr:href='&quot;http://pinterest.com/pin/create/button/?url=&quot; + data:post.url'>Pin It</a>
<a href='javascript:void(run_pinmarklet())' style='margin-left:-93px; width:43px; height:20px; display:inline-block;'/>
</div>
<script src='http://assets.pinterest.com/js/pinit.js' type='text/javascript'/>
<script type='text/javascript'>
function run_pinmarklet() {
    var e=document.createElement(&#39;script&#39;);
    e.setAttribute(&#39;type&#39;,&#39;text/javascript&#39;);
    e.setAttribute(&#39;charset&#39;,&#39;UTF-8&#39;);
    e.setAttribute(&#39;src&#39;,&#39;http://assets.pinterest.com/js/pinmarklet.js?r=&#39; + Math.random()*99999999);
    document.body.appendChild(e);
}
</script> 
</b:if>
</b:if>
<!-- Pulsante Pinterest Fine - http://www.ideepercomputeredinternet.com -->

che potrà essere incollato per esempio sopra la riga

<data:post.body/>

andando su Modello > Modifica HTML > Procedi e espandendo i modelli widget. Oltre all'allineamento a sinistra (left) può essere scelto quello a destra (right) o centrale (center). Le opzioni per il contatore sono le seguenti

Tipo di bottone	Valore di count-layout	Valore di margin-left
	Horizontal	-46px
	Vertical	-93px
	None	-46px

L'aggiornamento del numero dei Pin può impiegare qualche secondo. Oltre che nella posizione consigliata, vale a dire subito sopra al contenuto del post, il bottone con contatore di Pinterest può essere installato insieme ai bottoni di Facebook, Twitter e Google Plus allineati alla fine del post (o all'inizio).

Se il visitatore è loggato su Pinterest, quando cliccherà sul pulsante, vedrà aprirsi una scheda del browser in cui scegliere la foto (o le foto) da condividere sul suo account

e contemporaneamente postarla/e anche su Twitter e Facebook insieme a una breve descrizione

Come aggiungere il pulsante per essere seguiti su Pinterest

Tale pulsante al momento può essere installato solo in un elemento pagina HTML/Javascript e quindi posizionato per esempio in una sidebar. Il codice da incollare è riportato qui sotto e i bottoni sono quelli ufficiali di Pinterest

Bottone Seguimi su Pinterest	Codice da incollare
	<a href="http://pinterest.com/parsifal32/"><img src="http://passets-cdn.pinterest.com/images/follow-on-pinterest-button.png" width="156" height="26" alt="Seguimi su Pinterest" /></a>
	<a href="http://pinterest.com/parsifal32/"><img src="http://passets-cdn.pinterest.com/images/pinterest-button.png" width="78" height="26" alt="Seguimi su Pinterest" /></a>
	<a href="http://pinterest.com/parsifal32/"><img src="http://passets-cdn.pinterest.com/images/big-p-button.png" width="61" height="61" alt="Seguimi su Pinterest" /></a>
	<a href="http://pinterest.com/parsifal32/"><img src="http://passets-cdn.pinterest.com/images/small-p-button.png" width="16" height="16" alt="Seguimi su Pinterest" /></a>

Occorre sostituire solo il proprio nome utente al mio username "parsifal32". Come detto il codice va incollato su Layout > Aggiungi un gadget > HTML/Javascript e posizionato a piacere. Ho pubblicato in rete una

• Demo dei pulsanti di Pinterest per condividere e seguire -

Fonte | Blogger Sentral -