La condivisione dei contenuti attraverso i vari canali social è ormai una priorità per ogni sito moderno, ed è quindi un aspetto fondamentale che ogni web designer deve tenere conto durante la fase di realizzazione di ogni nuovo progetto web.
È necessario quindi aumentare la facilità di condivisione delle immagini per gli utenti. Cosa resa possibile grazie all’inserimento, come effetto di hover al passaggio del mouse sulle immagini, del bottone di condivisione di Pinterest, ovvero il principale social network a livello mondiale per la condivisione delle foto.
Grazie a questo semplice bottone infatti, le foto e le immagini presenti sul tuo sito web possono essere immediatamente pubblicate dagli utenti sulle proprie bacheche di Pinterest senza il minimo sforzo, aumentando così la visibilità del tuo sito web.
Inutile sottolineare di come tutto questo acquisti un valore anche maggiore, all’interno di una strategia di web marketing, nelle varie attività e aziende in cui le immagini hanno un ruolo predominante. Tra i vari esempi ci sono, banalmente, i fotografi ed i tatuatori, ma anche i negozi on-line, i cosidetti e-commerce, che attraverso la condivisione delle foto dei loro prodotti possono aumentare il loro bacino di utenza.
Inserire il bottone Pin It nel tuo sito web
Inserire il pulsante “Salva” di Pinterest (un tempo chiamato bottone “Pin It”) è veramente molto semplice. È Pinterest stesso infatti a fornirti la possibilità di creare e personalizzare questo bottone, in moodo da generare un semplice codice javascript da inserire nel tuo sito web.
Clicca sul seguente link per costruire il tuo bottone:
https://developers.pinterest.com/tools/widget-builder/?type=pinit
Come puoi vedere, in questa pagina guidata, puoi facilmente creare il tuo pulsante di condivisione personale, personalizzandone la grandezza, la forma e la lingua.
Oltre a queste impostazioni, all’interno del codice generato, puoi notare l’uso di due attributi particolari: async e defer. Questi sono due attributi per gli script finalizzati ad ottimizzare il caricamento della pagina.
Adesso, ti basterà inserire il codice javascript generato all’interno del tuo sito web, in particolare all’interno del tag <body>. Per essere ancora più precisi, è bene inserire questo piccolo codice subito prima della chiusura di questo tag, cioè subito prima del tag </body>, in modo da evitare che possa essere rallentato il caricamento della tua pagina web.
Inserire il bottone solo in alcune pagine (WordPress)
Adesso, dopo questa semplice operazione, tutte le immagini del vostro sito risulteranno facilmente pinnabili tramite il comodo bottone che comparirà al passaggio del mouse sull’immagine.
In alcuni casi però è preferibile evitare che questo pulsante compaia su tutte le immagini di tutto il tuo sito.
Io ad esempio volevo che questo bottone comparisse solo sulle immagini all’interno degli articoli del blog e non anche nelle varie pagine e nell’homepage.
Se avete un sito in WordPress tutto ciò è facilmente gestibile grazie ai conditional tags, che ti offrono molti tipi di filtri. Infatti, non solo puoi scegliere se applicare lo script solo agli articoli, ma puoi anche fare in modo che sia usato solo in determinate categorie oppure solo a determinati post.
Questo ad esempio è il codice che io ho inserito nell’footer.php del mio sito:
0 <!-- Bottone Pin It --> 1 2 3
Come si può vedere, ho inserito la condizione che il codice javascript venga caricato solo nei post del blog, sfruttando il tag condizionale is_single().
Adesso che anche tu sai come rendere facilmente pinnabili le vostre immagini, non hai più scuse, quindi scegli sempre delle foto di grande impatto emotivo e di buona qualità, e vedrai che esse verranno condivise con molta più frequenza.
