Come aggiungere un header a un blog su Blogger a Visualizzazione Dinamica.

Come aggiungere una immagine di Intestazione ai blog su Blogger del tipo Dynamics View senza operare sul codice HTML.

Mi occupo raramente di blog a Visualizzazione Dinamica perché sono poco personalizzabili anche se hanno un sacco di funzionalità, un aspetto accattivante, una velocità di apertura delle pagine sorprendente e una estrema facilità di navigazione per i lettori. Avevo già parlato di come inserire un header anche in questa tipologia di blog su Blogger modificando i CSS del modello.

Vediamo come si possa ottenere lo stesso risultato senza modificare il codice. L'altezza della intestazione per i modelli a Visualizzazione Dinamica è di 65 pixel quindi dovremo procurarci una immagine che abbia una altezza di quella misura. Il trucco consiste nell'inserirla come background anche se si visualizzerà solo nella parte alta del layout. Si va su Modello > Personalizza > Sfondo e eventualmente si rimuove l'immagine se fosse già presente. Si clicca sulla freccia che punta verso il basso accanto a Immagine sfondo e nella finestra che si apre si sceglie Carica immagine > Scegli file 

Si seleziona il file immagine che avevamo preparato. La vostra immagine si vedrà come sfondo il tutto il blog. Non fatevi prendere dalla paura perché tanto sul Designer Modelli i procedimenti sono reversibili. Andate su Completato per caricare l'immagine. In Allineamento selezionate uno dei tre proposti in alto. Vedete voi se vi rende meglio quello centrale, quello a sinistra o quello a destra



Scendete nel menù più in basso denominato Affianca e selezionate Affianca orizzontalmente



Ora nell'anteprima l'immagine di sfondo si vedrà solo nella intestazione. In seguito potrete selezionare i colori del blog nella parte destra dello strumento



Si va su Applica al blog per rendere effettive le modifiche effettuate

Se abbiamo creato una immagine in cui sia già presente il nome del nostro blog occorre nascondere quello che si visualizza automaticamente nell'header. Si va quindi su Modello > Modifica HTML e si clicca con il sinistro del mouse in un punto qualsiasi dell'area del codice del template. Si digita Ctrl+F e su Search si incolla la seguente riga ]]></b:skin> quindi si va su Invio nella tastiera. Il codice cercato verrà evidenziato e, subito sopra, dovrà essere incollato questo CSS

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

Si salva il modello e il titolo non sarà più visibile

Questo metodo di inserimento della immagine di Intestazione rispetto a quello linkato a inizio post ha la controindicazione che non si può utilizzare una seconda immagine di sfondo ma si può personalizzare il background con una delle associazioni di colori proposte o crearle con la apposita tavolozza.