Come nascondere elementi nei blog a Visualizzazione Dinamica.

Come intervenire nei CSS dei template di Blogger a Visualizzazione Dinamica.

Continuo nell'affrontare il tema delle personalizzazioni dei modelli di Blogger a Visualizzazione Dinamica. In linea generale quando si vuole modificare in qualche modo un elemento del layout di un blog vanno utilizzate le estensioni Firebug per Firefox o la più semplice Firebug Lite per Chrome.

Si tratta di ispezionare il layout per trovare il nome della classe o dell'ID del singolo elemento per poi applicare un CSS nel modello quando tale elemento non sia accessibile dalla scheda Layout. Recentemente è stata introdotta anche la possibilità di editare l'HTML del template del tipo Dynamic View dandoci anche la possibilità di incollare il codice direttamente nel modello.

Usando queste estensioni possono essere trovate queste classi per la visualizzazione Classic

1. class="header-bar" per la barra di ricerca in alto a destra
2. id="gadget-dock" per la barra scorrevole dei widget sulla destra
3. class="header-drawer" per la barra orizzontale che mostra le sette opzioni di visualizzazione

Quando si sono individuati i CSS si possono seguire le istruzioni di Blogger per modificare i fogli di stile nel Designer Modelli. I meno esperti possono anche consultare la breve guida su cosa si possa fare modificando i CSS. Ritornando al tema del post, per nascondere la barra di ricerca, basta andare su Modello > Personalizza > Avanzato > Aggiungi CSS e incollare il seguente codice

.header-bar #search { display:none !important; }

Si va su Applica al blog per rendere le modifiche effettive. Invece per nascondere la scelta tra i vari modelli si dovrebbe incollare la riga

#views { display: none !important; }

ma nel test che ho effettuato non la salva se applicata su Avanzato > Aggiungi CSS. E' invece possibile aggiungerla su Modello > Modifica HTML > Procedi. Si cerca la riga ]]></b:skin> e si incolla subito sopra ricordandoci di salvare il template.