Avete notato che passando con il mouse sopra ognuna delle immagini del mio blog compare il bottone di
Pinterest che permette di "pinnarle" direttamente?
Condividere su Pinterest un'immagine significativa di un vostro post può essere uno dei modi per incrementare ed incoraggiare il traffico verso il vostro blog.
Per cui se volete aggiungere anche voi questa funzione ecco come fare.
Cercate nel codice HTML del vostro blog </body> ed immediatamente sopra di esso aggiungete il seguente codice:
<script>
//<![CDATA[
var bs_pinButtonURL = "http://3.bp.blogspot.com/-y3xzTGiGzH0/UK4XOaUpdaI/AAAAAAAADw8/Z1MH4Jr4Efo/s1600/pinterestx1_72.png";
var bs_pinButtonPos = "center";
var bs_pinPrefix = "";
var bs_pinSuffix = "";
//]]>
</script>
<script src='http://ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js' type='text/javascript'></script>
<script
id='bs_pinOnHover'
src='http://greenlava-code.googlecode.com/svn/trunk/publicscripts/bs_pinOnHoverv1_min.js'
type='text/javascript'>
// This Pinterest Hover Button is brought to you by bloggersentral.com.
// Visit http://www.bloggersentral.com/2012/11/pinterest-pin-it-button-on-image-hover.html for details.
// Feel free to use and share, but please keep this notice intact.
</script>
Potete poi decidere in quale posizione collocare il bottone di Pinterest semplicemente sostituendo il pezzo di codice evidenziato qui sotto:
var bs_pinButtonPos = "center";
Al posto di center andate ad inserire la dicitura corrispettiva in base a dove volete far comparire il bottone:
- topleft (in alto a sinistra)
- topright (in alto a destra)
- bottomleft (in basso a sinistra)
- bottomright (in basso a destra)
Volendo potete anche utilizzare un bottone Pinterest personalizzato, disegnato da voi.
Per farlo andate a sostituire la parte di codice evidenziata con l'indirizzo URL dell'immagine da voi creata (ricordandovi di mantenere le virgolette).
var bs_pinButtonURL = "
http://3.bp.blogspot.com/-y3xzTGiGzH0/UK4XOaUpdaI/AAAAAAAADw8/Z1MH4Jr4Efo/s1600/pinterestx1_72.png";
Altrimenti se vi piace l'immagine del pin proposta lasciate il codice così com'è.
Potete anche personalizzare la descrizione dell'immagine pinnata in maniera che venga inserito automaticamente un testo da voi stabilito (il nome del blog, per esempio) prima (var bs_pinPreffix) o dopo (var bs_pinSuffix) la descrizione stessa. Ad esempio:
var bs_pinPreffix = "
nerdParty";
var bs_pinSuffix = "
by nerdParty";
dove la parte evidenziata indica quella che voi andrete ad aggiungere a vostro piacimento. Se volete potete aggiungere solo una delle due voci: io ad esempio ho inserito solo la seconda (by nerdParty) per evitare un'inutile ripetizione del nome del blog.
Una precisazione: le righe 7, 8 e 9 del codice caricano una libreria jQuery: eliminatele se nel vostro blog è gia caricata da qualche altra parte, perchè altrimenti il codice non funzionerà a dovere. (Ancora non ho capito esattamente in cosa consista e come si utilizzi una liberia jQuery - e se per caso lo sapete vi prego di illuminarmi - comunque so che se avete caricato delle slides o una galleria dinamica di immagini potrebbe esserci dietro una jQuery).
Happy Pinning! ;)
