Pubblicato il 17/02/12 - aggiornato il  | 11 commenti :

Come inserire il bottone di Pinterest su Blogger.

Il social Pinterest rappresenta la moda del momento e ha un trend di crescita eccezionale. E' un modo per condividere le immagini e le miniature dei video presenti nei vari siti. Sono state fatte delle ricerche secondo cui il traffico portato da Pinterest è già paragonabile a quello di Facebook e Twitter. Questo nonostante Pinterest sia ancora in fase Beta e a inviti.

Se ancora non vi siete iscritti a questo social potete farlo commentando questo post. Su Pinterest si possono organizzare e condividere immagini trovate in rete che a loro volta saranno visualizzate nel loro account dalle persone che sono vostri follower. Una furbata fatta dal team di sviluppatori di Pinterest è che quando si collega il nostro account con quello di Twitter, automaticamente diveniamo follower su Pinterest di tutti i nostri following su Twitter.

Basti pensare che pur avendo postato solo una immagine su Pinterest, il mio account ha 28 follower. Quando il servizio sarà aperto a tutti credo che diventerà imprescindibile avere sul nostro sito anche un bottone di condivisione su Pinterest delle immagini presenti nelle singole pagine del nostro blog. Ecco quindi che ho pensato di presentare un bottone di condivisione che può essere personalizzato per quello che riguarda la dimensione e la forma della icona. Il codice è questo

<a href="javascript:void((function(){var%20e=document.createElement('script');e.setAttribute('type','text/javascript');e.setAttribute('charset','UTF-8');e.setAttribute('src','http://assets.pinterest.com/js/pinmarklet.js?r='+Math.random()*99999999);document.body.appendChild(e)})());"><img alt="Pin It" class="aligncenter" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjUVlHs71-7LjpLTu4ix3FVPdOlXkTO9rj3vA_Yo36xtovjVuxptU_dk3u0tSVF8r6bRm31iF5g_tJe_ufVOIxfcrbXjb1ThRy-hTlBKymy_AAX7zDysqTYnkexndMDk3bxRJwe_JB8_Bw/s63/pinterest.png" /></a>

e deriva dalle API di Pinterest. Questo bottone è l'unico che sia riuscito per il momento a far funzionare e non ha il contatore. Penso che in futuro, quando il servizio uscirà dalla Beta e sarà definitivamente aperto al pubblico, sarà possibile avere anche pulsanti con i contatori dei Pin ricevuti

Si può incollare secondo varie modalità. Se si opta per metterlo solitario in una sidebar si deve aggiungere al codice <div> all'inizio e </div> alla fine (<div align="center"> se si vuole centrare), si incolla su Layout > Aggiungi un gadget > HTML/Javascript e si posiziona con il mouse.

Può anche essere inserito insieme agli altri pulsanti di Facebook, Twitter e Google Plus inserendo il codice in un elemento della tabella usata per l'allineamento. Può anche essere incollato direttamente nel modello subito prima del testo dell'articolo o subito dopo.

Nel primo caso si cerca la riga

<div class='post-body entry-content'> nei vecchi template

oppure la riga

<div class='post-body entry-content' expr:id='&quot;post-body-&quot; + data:post.id'> nei nuovi modelli

e si incolla il codice del bottone di Pinterest subito sotto dopo aver aggiunto i due tag div.

Se invece si vuole visualizzare alla fine dell'articolo si incolla il codice, sempre con i due tag div, subito sopra la riga

  <div class='post-footer'>

Se vogliamo avere un bottone più piccolo o di forma diversa da questo  possiamo sostituire l'URL in rosso con quello di un'altra immagine caricata sul nostro account Picasa, per esempio quest'altra .

Quando un utente cliccherà sul bottone di Pinterest in una pagina del nostro blog, si aprirà una nuova scheda del browser in cui saranno visualizzate tutte le immagini presenti nel post in cui si potrà selezionare quella desiderata per aggiungerla a un board (categoria che abbiamo creato) del nostro account

pinterest

Lo screenshot è stato fatto dopo aver pigiato il bottone nell'articolo sulle immagini catturate a alta velocità. In alto sarà visualizzata la scritta Cancel Pin che ci riporterà nella pagina di partenza. Se invece si clicca su Pin This su una foto, si aprirà una finestra di dialogo per aggiungerla al nostro account Pinterest. 

pinterest[5] 

Si potrà aggiungere a un Board già presente o cliccare su Create New Board. Dopo aver inserito una breve descrizione si clicca su Pin It. Come si può vedere dallo screenshot precedente, si può mettere la flag per condividere le immagini del post anche su Facebook e Twitter oltre che su Pinterest. Questo social network di foto diventerà fondamentale per tutti i blog che hanno nelle immagini un punto di forza delle loro pubblicazioni.



11 commenti :

  1. ho preferito metterlo nella colonna di destra visto che la mia home è piena di immagini a differenza di questo blog, un solo pulsantone rosso per ogni pagina non impiccia ed è bel visibile ;)

    RispondiElimina
  2. @ivabellini
    L'ho messo solo per testarlo, mi sa che lo tolgo finché Pinterest non sarà aperto a tutti.

    RispondiElimina
  3. Grazie Parsifal, sei sempre provvidenziale! ;)

    RispondiElimina
  4. Fantastico! Era proprio quello che cercavo <3

    RispondiElimina
  5. non lo vedo nel mio blog, eppure ho inserito il codice nella sidebar come gadget

    RispondiElimina
    Risposte
    1. Scusa, mi era sfuggito il tuo commento. Si tratta di un codice di sei anni e mezzo fa quindi è probabile che non funzioni più. Segui questo post
      https://www.ideepercomputeredinternet.com/2014/05/pinterest-button-hover-blogger-template.html
      che è più recente
      @#

      Elimina
  6. l'ho trovato..è verde e non blu, ma magari è un particolare irrilevante. Ho icollato sopre il codice, ma nulla...

    RispondiElimina
    Risposte
    1. I bottoni ufficiali di Pinterest sono qui
      https://developers.pinterest.com/docs/widgets/save/?
      puoi dargli una occhiata, magari lo farò anche io (senza impegno)
      I widget invece sono qui
      https://developers.pinterest.com/tools/widget-builder/?
      @#

      Elimina

Non inserire link cliccabili altrimenti il commento verrà eliminato. Metti la spunta a Inviami notifiche per essere avvertito via email di nuovi commenti.
Info sulla Privacy