Pubblicato il 11/02/13e aggiornato il

Come inserire il bottone di Pinterest nei blog di Blogger a Visualizzazione Dinamica.

Come installare il bottone di Pinterest nei Modelli a Visualizzazione Dinamica di Blogger.
Chi ha scelto di usare i template a Visualizzazione Dinamica per il proprio blog su Blogger deve rinunciare a quasi tutte le personalizzazioni che invece sono possibili con tutti gli altri modelli. Si possono solo nascondere determinati elementi, personalizzare l'intestazione, inserire certi widget, modificarne il colore e poco altro. Nei modelli più vecchi o anche in quelli del Designer Modelli possono essere installati i bottoni per condividere le immagini su Pinterest. Questo con certe limitazioni può essere fatto anche con i modelli a Visualizzazione Dinamica. C'è però una grossa limitazione visto che può essere condivisa solo una immagine precedentemente impostata. Speriamo che le personalizzazioni per questi modelli diventino sempre più frequenti visto che da qualche tempo è possibile andare su Modello > Modifica HTML per modificare il codice.

Dopo aver salvato il template si va su Modello > Personalizza > Avanzato > Aggiungi CSS e nell'apposito spazio in alto a destra si incolla il seguente codice


.pin-it-button-ss {
position: fixed;
top: 23px !important;
right: 230px !important;
z-index: 9999 !important;
}

Si clicca in alto su Applica al modello. Ora si va appunto su Modello > Modifica HTML > Procedi e si cerca la riga </body>. Subito sopra si incolla quest'altro codice

<script src='//assets.pinterest.com/js/pinit.js' type='text/javascript'/>
<script type='text/javascript'>$(document).ready(function() {function pinitss(){ if (document.readyState !== 'complete') setTimeout(pinitss,1000); else $("<a class='pin-it-button-ss' count-layout='horizontal' href='http://pinterest.com/pin/create/button/?url=http://design-prova.blogspot.com&amp;media=http://3.bp.blogspot.com/-tgnIOENwPqg/UREZLTFWwlI/AAAAAAAAf8o/kwZZe7r9xXs/s1600/articoli+simili.png'><img border='0' src='//assets.pinterest.com/images/PinExt.png' title='Pin It'/></a>").insertBefore('#header .header-bar .title');}pinitss();});</script>

Si salva il modello. Al posto dell'URL colorato di rosso si inserisce l'indirizzo del blog con il canonico .com finale mente al posto dell'UL colorato di viola si mette l'indirizzo della immagine che vogliamo venga pinnata dagli utenti. Si può settare la posizione del pulsante nell'header

pinterest-button-dynamic-view

modificando i parametri colorati di rosso nel primo codice che ne individuano la distanza dall'alto e dalla destra. Il bottone sarà visibile con tutti e sette i tipi di Dynamic Views. Come detto la foto condivisa sarà sempre quella che abbiamo impostato e questo è il limite di questo tool.
Fonte | Southern Speakers -




Nessun commento :

Posta un commento

Non inserire link cliccabili altrimenti il commento verrà eliminato. Metti la spunta a Inviami notifiche per essere avvertito via email di nuovi commenti. Se ti ho aiutato con il post o con le risposte ai commenti condividi su Facebook o su Twitter. Grazie.