Bottone di Pinterest che si evidenzia in tutte le immagini al passaggio del mouse.
Pinterest è il social network del momento ed è uno di quelli con il maggiore tasso di crescita insieme a Instagram. La condivisione di immagini su Pinterest può essere molto utile anche per aumentare il traffico di quei blog che fanno delle immagini il loro punto di forza. E' stato appena pubblicato un articolo a firma di Greenlava che ritengo molto interessante visto che con un semplice script si può visualizzare il pulsante di condivisione su Pinterest quando il mouse passa sopra a una immagine.
Inoltre il bottone è in grado di selezionare l'URL del post giusto anche se l'immagine è stata pinnata nella homepage o in una pagina di etichetta. Ecco come sono le immagini se ci si passa sopra con il mouse
con il bottone di Pinterest che in questo caso è stato posizionato al centro. L'installazione dello script è piuttosto semplice. Si va su Modello > Modifica HTML e si cerca la riga </body> . Subito sopra si incolla
<script>
//<![CDATA[
var bs_pinButtonURL = "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhfP3RmBH_iKv7s0pEGHc0Z-af-QYa9VeiDkt-bNpEU1EMxjTrNutlsthBn_EqLwWtasnMZCnAmjnpEQVNZAgO7PAm6icS37pvMw8hYAqBo-G264s1dEI6mYUkRhU5f6M_SG5gzcq9qmQ4j/s1600/pinterestx1_72.png";
var bs_pinButtonPos = "center";
//]]>
</script>
<script src='http://ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js' type='text/javascript'/>
<script src='http://greenlava-code.googlecode.com/svn/trunk/publicscripts/bs_pinOnHoverv1_min.js' type='text/javascript'/>
<!-- please do not alter or remove the following code -->
<div id='bs_pinOnHover'><a href="http://www.bloggersentral.com/2012/11/pinterest-pin-it-button-on-image-hover.html">Pin It button on image hover</a></div>
//<![CDATA[
var bs_pinButtonURL = "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhfP3RmBH_iKv7s0pEGHc0Z-af-QYa9VeiDkt-bNpEU1EMxjTrNutlsthBn_EqLwWtasnMZCnAmjnpEQVNZAgO7PAm6icS37pvMw8hYAqBo-G264s1dEI6mYUkRhU5f6M_SG5gzcq9qmQ4j/s1600/pinterestx1_72.png";
var bs_pinButtonPos = "center";
//]]>
</script>
<script src='http://ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js' type='text/javascript'/>
<script src='http://greenlava-code.googlecode.com/svn/trunk/publicscripts/bs_pinOnHoverv1_min.js' type='text/javascript'/>
<!-- please do not alter or remove the following code -->
<div id='bs_pinOnHover'><a href="http://www.bloggersentral.com/2012/11/pinterest-pin-it-button-on-image-hover.html">Pin It button on image hover</a></div>
quindi si salva il modello. L'autore per utilizzare questa personalizzazione richiede che non si modifichi o cancelli il link al suo articolo. Consente però di cambiare il bottone il cui URL è colorato di viola con uno di nostro gradimento. La riga in rosso rappresenta la libreria JQuery e può essere tolta se fosse già presente nel nostro modello.
La posto di center possono essere inserite le seguenti alternative con ovvio significato: topleft, topright, bottomleft o bottomright. Per installare i bottoni di Pinterest ricordo anche i post
Fonte | Blogger Sentral -
Franco Colla · Capo presso Me stesso
RispondiEliminaCiao !
Ho istallato questo plugin sul mio blog www.fedetails.net ma ho il problema che il pulsante appare anche sui bottoni di condivisione ai social che ho a fine post...e se uno non è preciso preciso a clikkare invece di condividere col social si apre la pagina di pinterest tutte le volte causando un po di caos ! Non è che hai qualche idea come fare ?
Grazie mille !
@CollaFranco
EliminaCome precisato nel post il plugin è stato ripreso da un altro blog e quindi non posso modificare il codice. Comunque se il bottone in posizione centrale ti da noia puoi spostarlo in alto, in basso, a sinistra o a destra. Inserisci topleft, topright, bottomleft o bottomright al posto di center.
è una meraviglia questo plugin :)
RispondiEliminaHo tentato l'operazione, ma mi compare questa scritta
RispondiEliminaErrore di analisi XML, riga 702, colonna 3: The element type "b:skin" must be terminated by the matching end-tag "
Premesso che sono moooolto imbranata....c'è qualcosa che posso fare per completare l'operazione???
Grazie fin da ora.
@# Se non ti prende il codice può darsi che tu non lo abbia copiato bene oppure che nel tuo template proprio non vada. La riga in cui c'è l'errore è all'inizio mentre questo codice viene inserito alla fine del modello quindi non riesco a vedere la connessione.
EliminaE se io non avessi la riga < /body >?
RispondiElimina@# Impossibile. Non solo la riga /body esiste nei modelli di Blogger ma in una qualsiasi altra pagina web. Forse hai problemi a cercare il codice. Leggi qui
Eliminahttp://www.ideepercomputeredinternet.com/2013/04/how-to-search-blogger-template-code.html
Scusa ma nell'altro post non avevo attivato l'iscrizione ai commenti e quindi non l'ho visto
EliminaPerdonami ma cercavo con l'F3................ no comment!
ciao ernesto, può essere che questo script abbia smesso di funzionare, io non visualizzo più il tasto pinterest, da cosa può dipendere?
RispondiEliminaSegui questo post aggiornato per sostituire il vecchio script
Eliminahttp://www.ideepercomputeredinternet.com/2016/05/pinterest-blogger-wordpress-bottone-javascript.html
@#
perfetto è tornato a funzionare tutto, grazie mille :-D
Eliminacome posso eliminare il tasto pinterest dalle immagini del widget post correlati
RispondiEliminaNon so che widget tu abbia e mi pare strano che si veda il bottone di Pinterest. Infatti ho aperto questo post
Eliminahttp://www.madeinbottega.com/2016/06/come-realizzare-sfondo-lo.html
e non ho visto pulsanti Pinterest sulle immagini del widget a fondo pagina
@#