Pubblicato il 20/06/10 - aggiornato il  | 21 commenti :

Come personalizzare i pulsanti ufficiali di condivisione di Blogger.

In un precedente articolo ho parlato di come inserire i bottoni di condivisione in un post di Blogger. Vediamo più nel dettaglio altre possibili personalizzazioni. Ricordo che il codice da inserire è il seguente

<!-- BOTTONI CONDIVISIONE INIZIO-->
<b:if cond='data:blog.pageType == &quot;item&quot;'>
<div class='post-share-buttons'>
<b:include data='post' name='shareButtons'/>
</div>
</b:if>
<!--BOTTONI CONDIVISIONE FINE-->

La posizione di inserimento determinerà il punto di visualizzazione dei pulsanti. Se si vogliono vedere ovunque, e non solo nei singoli post, possono essere tolte le due righe di codice evidenziate di rosso.

Per posizionarli subito sotto il post, il codice va incollato dopo la riga <div class='post-footer'>. Se si vuole andare più in basso occorre metterli dopo la riga <div class='post-footer-line post-footer-line-1'> o, alternativamente, dopo le linee

<div class='post-footer-line post-footer-line-2'> oppure

<div class='post-footer-line post-footer-line-3'>

E' probabile che Blogger aggiungerà nuovi pulsanti a quelli già presenti. Intanto possiamo togliere quelli che non ci interessano. Per esempio il bottone per postare l'articolo su un blog di Blogger mi sembra decisamente inutile. Si può eliminare questo pulsante andando su Layout > Modifica HML e prima della riga

]]></b:skin>

incollare la seguente classe

.sb-blog{display:none}

quindi salvare il modello. Il pulsante con la B di Blogger sparirà da sotto il post. Se si vogliono togliere gli altri bottoni occorre sostituire a sb-blog con sb-email (pulsante email), sb-twitter (pulsante Twitter), sb-facebook (pulsante Facebook) e sb-buzz (pulsante Google Buzz).

Per vedere come appaiono questi pulsanti inseriti dopo la post-footer-line-1 guardate questo post in cui è stato anche tolto il bottone di Blogger.

Fonti | Le Blogger e Blogger Plugins -



21 commenti :

  1. fatto... l'ho messo sotto a tutto e ho levato buzz :) e l'ho messo visibile anche nell'articolo in forma sintetica... era proprio come lo volevo. Grazie mia guida informatica :*

    RispondiElimina
  2. Ho provato a personalizzarli anch'io, per renderli più visibili.
    li ho staccati e ho inserito con i css il bordo a destra che altrimenti viene perso staccandoli (o togliendo l'ultimo, come ha fatto Soffio di Dea) e un colore di sfondo.
    questo il codice:

    (span style='font-size:120%;font-weight:bold;vertical-align:middle;padding-right:8px')Condividi:(/span)(div class='post-share-buttons' style='background:#F6BB17;padding:6px')
    (b:include data='post' name='shareButtons'/)
    (/div)
    questo il link per vedere l'effetto, se interessa:
    http://www.genitorisottratti.it/2010/06/alla-faccia-della-mediazione-familiare.html
    *<> al posto di ()

    RispondiElimina
  3. @Giorgiogal
    Molto carino e interessante. E' una personalizzazione certamente utile dal punto di vista estetico e da quello pratico

    RispondiElimina
  4. Ciao, ho provato a cancellare il pulsante "condividi su blogger" ma nonostante la modifica fatta al codice html mi compare comunque. Come posso fare?

    RispondiElimina
  5. EmergencyRoom IlBlog
    Hai provato a toglierli direttamente dal layout?
    http://www.ideepercomputeredinternet.com/2010/12/impostazioni-per-configurare-il-post-su.html
    Se lo hai già tentato non so cosa altro consigliarti

    RispondiElimina
  6. come si fa a mettere i tasti di tutti i social?

    RispondiElimina
    Risposte
    1. @barbasilisco
      Se li vuoi proprio tutti prova con AddThis
      http://www.ideepercomputeredinternet.com/2011/12/come-inserire-i-bottoni-di-condivisione.html

      Elimina
  7. Ciao Ernesto ,non riesco a trovare l'articolo relativo alla possibilità di inserire i tre bottoni di condivisione nello stile che hai sul tuo blog con il contatore. Puoi aiutarmi? Grazie

    RispondiElimina
    Risposte
    1. @Enzo
      Vai qui
      http://www.ideepercomputeredinternet.com/2011/06/come-allineare-i-bottoni-di-facebook.html

      Elimina
  8. Help ! Un paio di giorni fa ho applicato questa modifica sul mio blog. Ora volevo toglierla per mettere un altro tipo di bottoni ( quelli più grandi che indichi in un altro post). Solo che quando vado a cercare il rigo div ecc., risulta inesistente. La modifica che ho fatto un paio di giorni fa non risulta più all'interno dell'HTLM ma sul blog si. Com'è possibile? Cosa devo fare per togliere quest'ultima modifica?
    Grazie.

    RispondiElimina
    Risposte
    1. @ Vai su Layout > Post sul Blog > Modifica e configura il post senza bottoni
      http://www.ideepercomputeredinternet.com/2010/12/impostazioni-per-configurare-il-post-su.html

      Elimina
    2. Avevo già provato a fare così. Spuntando quella casella i bottoni rimangono ancora solo che non funzionano.
      Non capisco come mai sia sparita la modifica all'interno dell'HTLM eppure avevo cambiato anche il colore della scritta "Condividi" da rosso a verde. In ogni caso pur volendo lasciare i bottoni così non posso fare altre modifiche perché è sparito il rigo div class='post-footer'. Si può reinserire?

      Elimina
    3. @ Ho l'impressione che tu non abbia messo la spunta su Espandi i modelli widget e per questo non trovi il codice

      Elimina
    4. Grazieeee !!! Hai ragione era così...decisamente me ne intendo poco ! Grazie infinite per tutto l'aiuto che dai !
      Buona serata : ) !

      Elimina
  9. Ciao, grazie per questo post!
    Ho appena aperto un blog su blogger, e trovavo fastidiosi i pulsanti, quindi per me sei stata utilissima nel tentativo di disattivarli. Il problema però, è che il pulsante di Google+ non riesco a toglierlo...

    RispondiElimina
    Risposte
    1. Per non visualizzare i pulsanti segui le istruzioni di questo post
      http://www.ideepercomputeredinternet.com/2010/12/impostazioni-per-configurare-il-post-su.html
      Basterà togliere la spunta e non vedere più tutti i pulsanti

      @#

      Elimina
  10. Ciao,
    è possibile personalizzare il layout del post che viene condiviso? Per esempio, condividendo il post su Facebook compare in automatico la foto, : , | .
    Quello che volevo capire è se si può ad esempio andare ad eliminare uno di questi elementi, aggiungerne o modificarne l'ordine.
    Stessa cosa per la condivisione sugli altri social.

    Guardando il codice html del template mi sembra di capire che la stringa che gestisce questa cosa è "data:post.sharePostUrl" (per il template che ho scelto si trova alla riga 1577), ma non riesco a capire dove e come personalizzarla.

    Grazie
    Ciao

    RispondiElimina
    Risposte
    1. Ho visto che pubblicando la domanda mi ha eliminato alcuni elementi...
      Provo a riscrivere.
      [...]
      Per esempio, condividendo il post su Facebook compare in automatico la foto, nome-blog: titolo-post, url-blog | autore.

      Elimina
    2. Alcune cose si possono fare e altre no. Nella condivisione su Google+ si può scegliere la foto mentre su Facebook è più difficile. Ci sono diverse cose da fare. La prima è quella di impostare la condivisione con prima il titolo del post e a seguire il nome del blog
      http://www.ideepercomputeredinternet.com/2015/10/blogger-titolo-post-nome-blog-modello.html
      Come seconda operazione bisogna impostare le Preferenze di ricerca per lo snippet o descrizione o riassunto del post
      http://www.ideepercomputeredinternet.com/2012/03/come-personalizzare-le-preferenze-di.html
      leggi il post limitatamente alla sezione
      EDITOR DI BLOGGER DESCRIZIONE E TAG IMMAGINI
      Devi poi inserire i metatag per la condivisione nei vari social network
      http://www.ideepercomputeredinternet.com/2015/12/blogger-metatag-google-facebook-pinterest-twitter.html
      Per Facebook potrebbe essere necessario una ulteriore passaggio
      http://www.ideepercomputeredinternet.com/2013/03/open-graph-facebook.html
      @#

      Elimina
    3. Grazie mille!
      Farò delle prove con le indicazioni che mi hai dato.
      Buona serata

      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