ho un tot di anni durante i quali ho fatto taaaaante cose, tipo fare due figli che sono la gioia della mia esistenza. Sono blogger dal 2007, ma dal 2008 lo sono un po' più seriamente... ci ho creduto di più dai.
Volevo fare la stilista, vestire persone, ma oggi mi piace quasi definirmi stilista del web, perchè vesto i blog con abiti su misura appositamente per le bloggers che decidono di collaborare con me, affidandomi i loro tessssori.
Perchè il blog è un nostro tesssssoro, vero?
Seguimi su Pinterest! Tanti pin per ispirare la tua moodboard e la tua creatività!
Seguimi su Pinterest! Tanti pin per ispirare la tua moodboard e la tua creatività!

20.2.16

Blog design: pulsanti condivisione personalizzati

20.2.16

2 comm


I bottoni per condividere il post sono davvero molto importanti all'interno di un blog. Se non avete grandi pretese potete utilizzare quelli che Blogger mette a disposizione.
Se invece pensate che niente deve essere lasciato al caso, e che quindi persino gli share buttons debbano essere abbinati alla grafica corrente del vostro template... beh allora questo è il post che fa per voi.

Il codice si poggia su uno script di AddThis.com, che vi consiglio di visitare ed esplorare per questo genere di risorse, dopodiché non resta molto da spiegare.
Infatti vi basterà copiare ed incollare il codice qui sotto all'interno del vostro HTML.

Il meccanismo di ricerca è sempre lo stesso: cliccate all'interno della finestra del codice CTRL+F e incollate questa riga  <b:includable id='post' var='post'> e premete 'invio'.

Fatto ciò, vi sarà evidenziata in giallo la parte interessata. Scendete pian, piano fino ad arrivare a questa riga  <span class='post-labels'> e incollate subito sotto il codice  degli share buttons:
<!-- AddThis Button BEGIN -->
<div style='text-align: center;margin-top:20px;'>
<div class='addthis_toolbox'>

<div class='custom_images'>
<a class='facebook' expr:href='&quot;http://www.facebook.com/sharer.php?u=&quot; + data:post.url + &quot;&amp;t=&quot; + data:post.title' rel='nofollow' target='_blank' title='Share This On Facebook'>
<img alt='Facebook share' border='0' src='URL_IMMAGINE' style='margin-right:5px;'/></a>

<a class='twitter' expr:href='&quot;https://twitter.com/share?url=&quot; + data:post.url + &quot;&amp;title=&quot; + data:post.title' rel='nofollow' target='_blank' title='Tweet This'><img alt='Twitter share' border='0' src='URL_IMMAGINE' style='margin-right:5px;'/></a>

<a class='addthis_button_pinterest_share'><img alt='Pin This' border='0' src='URL_IMMAGINE' style='margin-right:5px;'/></a>

<a class='addthis_button_google_plusone_share + data:post.url + &quot;&amp;t=&quot; + data:post.title' rel='nofollow' target='_blank'><img alt='Share on Google Plus' border='0' src='URL_IMMAGINE' style='margin-right:5px;'/></a>

</div></div></div>
<script type='text/javascript'>var addthis_config = {&quot;data_track_addressbar&quot;:true};</script><script src='//s7.addthis.com/js/300/addthis_widget.js#pubid=ra-511bbe8405a64ebd' type='text/javascript'/>
<!-- AddThis Button END -->

Per completare il tutto non vi resterà che inserire l'URL delle vostre immagini che raffigureranno i vari social: facebook, twitter, pinterest e google+.
Io ho inserito solo questi quattro, perchè credo siano quelli che abbiano maggiore influenza e affluenza.

Spero che questo tutorial vi sia di aiuto: se così è stato vi prego di condividerlo e magari lasciare un commento, che non fanno mai male :)

Baci!!!!
Iscriviti alla mia newsletter per ricevere consigli sul blogging, il design, la pianificazione e pdf gratuiti per gli iscritti alla newsletter ♥
(Ma prima leggi la mia informativa sulla privacy.)
si, iscrivimi!

2 commenti:

  1. Quindi devo inserire i link dei tasti che mi piacciono? Dove li trovo sul web uguali? Grazie mille per il tuo aiuto :)

    RispondiElimina
    Risposte
    1. Questi li ho creati io con photoshop. Li ho fatti colorati, ma con un codice ho tolto la saturizzazione...in pratica li resi quasi grigi :)

      Elimina

Lasciando un commento dichiari di aver letto la mia Privacy Policy