Come visualizzare una icona al posto del puntino nell'elenco del widget Etichette di Blogger.

Come sostituire l'elenco puntato del widget delle Etichette di Blogger con un elenco personalizzato con icone.

A seguito di un commento ricevuto in un articolo su come personalizzare gli stili degli elenchi passo a illustrare in questo instant post come procedere per sostituire il puntino nell'elenco del widget delle Etichette di Blogger con una icona a scelta del webmaster.

Il widget delle Etichette si installa andando su Layout -> Aggiungi un gadget -> Base -> Etichette. Nella finestra di configurazione che si apre ci sono varie opzioni. Una particolarmente interessante è quella che ci permette di selezionare solo alcune delle etichette da visualizzare mettendo la spunta su Etichette selezionate al posto di Tutte le etichette. La seconda opzione permette di scegliere l'ordine alfabetico o quello di frequenza. C'è anche il quadratino per mostrare opzionalmente il numero di post che ha ciascuna etichetta.  Con la terza opzione si sceglie l'aspetto del widget tra Elenco e Etichetta.

La spiegazione seguente permette appunto di modificare il widget Etichette con lo stile Elenco. Il nostro obiettivo sarà quello di avere un risultato come questo

Se avete installato nel vostro blog un solo gadget delle etichette questo avrà Label1 come ID del Widget mentre se ne avete installati due e solo in questo caso potrebbe avere Label2. Dopo aver salvato il template si va su Modello -> Modifica HTML e si cerca la sezione <b:skin> che si trova intorno alla 10-esima, 12-esima riga. Si clicca sulla freccetta nera posta a sinistra per visualizzare tutto il codice della sezione. Con Ctrl+F si cerca la riga ]]></b:skin> e, subito sopra, si incolla questo codice di una regola CSS

#Label1  div ul {list-style-image: url(https://lh4.googleusercontent.com/-6o-hCK6GULw/UiEydedhX2I/AAAAAAAAjTI/_u9YCgNgGwI/s10/check-10x10.png);}

Si salva il modello.  Ovviamente l'URL della icona che è colorato di rosso può essere sostituito con quello di un'altra immagine mentre al posto di Label1 si può mettere Label2 nel caso di due widget.