Pubblicato il 17/04/16e aggiornato il

Come aggiungere un bottone fluttuante su Blogger per la iscrizione come Lettori Fissi.

Come installare un bottone per farsi seguire come Lettori Fissi su Blogger in una sidebar o fluttuante nel layout senza avere il widget dei Lettori.
Il widget dei Lettori Fissi di Google è stato ritirato tempo fa dai siti non Blogger ma continua a avere grande successo tra gli utenti della piattaforma di Google. Il sistema più usato per invitare i visitatori a iscriversi come Lettori al nostro sito è quello di installare il Widget Lettori Fissi che è uno di quelli ufficiali di Blogger. Con l'iscrizione al widget dei Lettori Fissi si potranno visualizzare i titoli e gli incipit dei post nella Bacheca di Blogger in Elenco di Lettura.

Si va su Layout > Aggiungi un gadget > Altri gadget > Lettori Fissi per poi selezionare i colori del widget e andare su Salva. Il gadget dei lettori può successivamente essere posizionato nella sidebar o nel footer con il drag & drop del cursore. Si può anche dare un nome al widget o usare gli stili predefiniti dei modelli. I colori degli elementi del widget possono essere configurati tramite i codici dei colori.

lettori-fissi-blogger

Se non abbiamo spazio nella sidebar possiamo optare per inserire un semplice bottone di iscrizione.

COME RICAVRE L'ID DEL NOSTRO BLOG SU BLOGGER


Per la creazione di un bottone che permetta l'iscrizione occorre conoscere l'ID univoco che lo caratterizza. Per scoprirlo ci sono molti modi. Uno dei più semplici è quello di andare su Bacheca > Post e cliccare su Modifica sotto a uno qualsiasi degli articoli che si sono pubblicati. Si aprirà l'Editor del post e dovremo prestare attenzione all'indirizzo mostrato nella barra del browser

id-blog-blogger

L'ID del blog è quella serie di 19 numeri che si trova dopo blogID= e prima di #editor.  

COME MOSTRARE IL BOTTONE IN UNA SIDEBAR


Dovremo realizzare un bottone oppure cercarne uno che fa al caso nostro su internet. Chi non abbia dimestichezza con la creazione di pulsanti può seguire il tutorial su come realizzare un bottone animato su Photoshop che può risultare utile anche a chi abbia nel computer il gratuito Gimp

iscrizione-lettore-fisso

Chi volesse usare il bottone mostrato qui sopra può cliccarci sopra con il destro del mouse e scegliere salva immagine con nome per poi caricarlo su Picasa. Alternativamente può andare sempre sul destro del cursore e scegliere Copia Indirizzo immagine da usare nei codici successivi.

COME INSTALLARE IL BOTTONE IN UNA SIDEBAR


Se vogliamo mostrare il bottone insieme agli atri widget nella sidebar si va su Layout > Aggiungi un gadget > Base > HTML/Javascript e si incolla questo codice

<div align="center">
<a href="http://www.blogger.com/follow-blog.g?blogID=XXXXXXXXXXXXXXXXXXX" target="_blank" rel="nofollow" title="Segui come Lettore" alt="Bottone Segui" /><img src="https://lh3.googleusercontent.com/-Lm74lrW78V4/VxNSP8JNDpI/AAAAAAAA1P8/T1WwsHiWpIMPee9v7m1dwCOjNXOlyVQGwCCo/s200-Ic42/bottone2.png" border="0" /></a></div>

Naturalmente il bottone può essere sostituito da un altro cambiandone l'URL colorato di rosso. Al posto di XXXXXXXXXXXXXXXXXXX si deve sostituire l'ID del blog come mostrato sopra.

COME INSTALLARE IL BOTTONE IN MODO FLUTTUANTE


Se volessimo mostrare il pulsante in una posizione che rimanga fissa allo scorrimento delle pagina dovremo procedere nello stesso modo cioè andare su Layout > Aggiungi un gadget > Base > HTML/Javascript e incollare quest'altro codice

<div style="position: fixed; top: 50px; right: 100px;">
<a href="http://www.blogger.com/follow-blog.g?blogID=XXXXXXXXXXXXXXXXXXX" target="_blank" rel="nofollow" title="Segui come Lettore" alt="Segui come lettore su Blogger" /><img src="https://lh3.googleusercontent.com/-Lm74lrW78V4/VxNSP8JNDpI/AAAAAAAA1P8/T1WwsHiWpIMPee9v7m1dwCOjNXOlyVQGwCCo/s200-Ic42/bottone2.png" border="0" /></a></div>

Il bottone sarà mostrato sempre a una distanza di 50 pixel dalla parte alta e di 100 pixel dalla destra del layout. Si può modificare la posizione sostituendo per esempio top con bottom per settare la distanza dal basso e right con left per settare la distanza dalla sinistra.


Quando qualcuno cliccherà nel pulsante verrà visualizzata una finestra come la seguente

seguire-blog-lettori-fissi

in cui decidere se seguire in modo pubblico o anonimo il sito in questione.





4 commenti :

  1. si puo modificare google traduttore widget del blog, ogni volta che traduce un post si unisce tutto il post senza spazio:

    normal:

    ----- ---- - -----

    -----------------
    ----------------
    -------------

    usato il traduttore


    ---------------
    ----------------
    ----------------
    ----------------

    lei pensa che questa cosa possa scoraggiare i lettori?

    RispondiElimina
    Risposte
    1. Onestamente non ho capito il problema. Prima di considerarlo va su Bacheca > Statistiche > Pubblico e guarda quante visite hai da fuori Italia, probabilmente saranno inferiori al 10% del totale. Tra queste ci sono persone che cercano parole chiave in italiano vivendo all'estero ma che sanno la lingua, quindi sarà solo una piccola minoranza che userà il Traduttore di Google.
      @#

      Elimina
  2. Buonasera. Avrei un piccolissimo problemino tecnico che altri non mi hanno saputo dire come risolvere. Ho un blog a sfondo nero, e da qualche giorno la scritta "Follower" del gadget Lettori fissi è diventata nera e non più bianca, non si adatta più allo sfondo del blog, non riesco nemmeno a modificare i colori del gadget. E' un problema di compatibilità con qualche altro elemento del blog? E' risolvibile? Grazie 😉

    RispondiElimina
    Risposte
    1. Ti do due opzioni. La prima è rischiosa.
      1) Rimuovi il widget quindi lo reinstalli andando su Layout -> Aggiungi un gadget -> Altri gadget -> Lettori Fissi. In questo modo nella finestra di configurazione vedrai i colori che potrai così configurare
      http://i.imgur.com/Zmve3Uj.png
      2) Puoi provare a modificare il colore dello sfondo in questo modo:
      a) Vai su Modello -> Modifica HTML e cerca la riga
      ]]></b:skin>
      e subito sopra incolla questo codice
      #followers-iframe-container {background:#FFF !important;}
      dove il colore #FFF lo puoi modificare a piacere
      @#

      Elimina

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.