Come modificare o nascondere la scritta Visualizzazione dei post con etichetta ... nei Nuovi Temi di Blogger.

Come nascondere la barra delle pagine delle etichette con la scritta Visualizzazione dei post con etichetta ... o come modificarla nei colori e nei caratteri.

Nel post precedente abbiamo visto come funziona  lo strumento Ispeziona Elemento di Chrome che ci permette di trovare il selettore univoco di un elemento di una pagina web.

I selettori classici del CSS si dividono in due tipi .NomeClasse e #NomeID e sono delle regole con cui selezionare  rispettivamente lo stile di una serie di elementi con caratteristiche comuni o un singolo elemento presente nella pagina web. Ci sono anche altri selettori introdotti non le ultime versioni del linguaggio CSS come per esempio .NomeClasse:before, .NomeClasse:after, #NomeID:before, #NomeID:after per inserire un contenuto rispettivamente prima o dopo dell'elemento selezionato.

Quando si sia individuato il selettore giusto possiamo creare una nuova regola con questa sintassi

.NomeClasse { .... }  o   #NomeID { .... } 

dove tra le due parentesi graffe si aggiungono le righe per regole di dimensioni dei caratteri, sfondi, colori, bordi, famiglie di font o anche per nascondere l'elemento con quel tale ID o con quella tale classe.

Vediamo come usare questa procedura per nascondere o per modificare la scritta che si visualizza nei Nuovi Temi Responsive di Blogger quando si apre una pagina di etichette.

Avevo già presentato questa personalizzazione per i Modelli di Blogger precedenti. Sono però cambiati i Nomi delle Cassi nei Nuovi Temi Responsive di Blogger e il codice presentato non è funzionante. Lo è invece nei precedenti template che non siano appunto Contempo, Soho, Emporio e Rilevanti.

NASCONDERE LA SCRITTA VISUALIZZAZIONE DEI POST...

Con il Tool Ispeziona di Chrome il cui tutorial è stato linkato all'inizio si riesce facilmente a trovare il Nome della Classe della Barra orizzontale in cui viene mostrata questa scritta

Sia nel Tema Contempo sia in quello Emporio il nome della classe è

.post-filter-message

Non ho testato gli altri Temi ma ritengo verosimilmente che il nome della classe sia la stessa per tutti i nuovi modelli. Se si decidesse di nascondere tale barra, che comunque è esteticamente migliore di quella dei precedenti Temi, si devono usare i tag display:none; e visibility:hidden;. 

Si va su Tema -> Modifica HTML e si cerca la riga ]]></b:skin> quindi, subito sopra, si incolla questo codice

.post-filter-message {display:none; visibility:hidden;}

e infine si salva il Tema. La Barra in oggetto verrà nascosta per tutte le etichette.

COME MODIFICARE LA BARRA VISUALIZZAZIONE DEI POST ...

Se la barra con la scritta ci piace ma volessimo modificarla nei colori si può incollare per esempio questo codice

div.post-filter-message {background-color:#defcd6 !important; color:#f00 !important;}
div.post-filter-message a {color:#00f !important;}

sempre subito sopra a ]]></b:skin> per poi salvare il Tema. Il risultato sarà il seguente

Naturalmente possono essere modificati i codici dei colori dello sfondo, del testo e del link Visualizza tutti. Si possono anche aggiungere altre righe per modificare la famiglia dei font, per aggiungere il grassetto, per togliere il corsivo, ecc.