Come creare un menù orizzontale in Blogger senza codice.

Come creare un menù orizzontale in Blogger senza usare nessun codice ma solo il widget Elenco di Link.

Siete utenti di Blogger ma non amate molto operare con i codici? Sicuramente non siete una eccezione. Vi piacerebbe creare un menù orizzontale da mettere al posto di quello delle Pagine Statiche? Oppure volete metterlo insieme a quello magari sopra, oppure sotto?

Su Blogger è possibile operare un piccolo trucco per far diventare un orizzontale un elenco verticale. La ragione di questa modifica sta nei CSS specifici per le sezioni che stanno al di sopra dell'area del post e che vengono definite come Crosscol o Cross-Column. Queste sezioni sono presenti in tutti i modelli ufficiali di Blogger esclusi quelli del tipo a Visualizzazione Dinamica. Se avete un template scaricato da internet può capitare che questa sezione non ci sia.

Ricordo che si può creare il menù delle Pagine Statiche andando su Layout > Aggiungi un gadget > Base > Pagine per poi configurare il menù. Si possono selezionare solo alcune delle pagine che sono state pubblicate, si può modificare il loro ordine con il trascinamento del cursore e si può optare per mostrare il widget in verticale nella sidebar o in orizzontale sotto l'header cioè in una sezione Cross- Column o Crosscol

L'ID del menù delle Pagine statiche è PageList1 e tramite i CSS possiamo sotto certi limiti riuscire a personalizzarlo. Nel menù che si viene a creare possiamo anche aggiungere dei link esterni al nostro sito. Andando su Layout > Pagine > Modifica si clicca su +Aggiungi un link esterno

per aggiungere una nuova voce digitando titolo e indirizzo poi si salva il link e widget.

CREARE UN NUOVO MENÙ ORIZZONTALE

Si va su Layout > Aggiungi un gadget > Base > Elenco di link e si inizia la configurazione

Si sceglie Non eseguire l'ordinamento perché lo faremo noi tramite il cursore, si digita il nome del link e si incolla il suo URL quindi si clicca su Aggiungi link e si passa a un'altra voce del menù. Dopo essere andati su Salva si trascina l'elemento dell'Elenco di link in una sezione Crosscol

Si va quindi in alto su Salva disposizione. Il risultato sarà simile al seguente



Si può scegliere di posizionare l'Elenco di link sopra o sotto al menù delle Pagine.

CASI PARTICOLARI

Se ci sono due sezioni Cross-Column come nello screenshot si può inserire un menù in ciascuna delle sezioni. Si possono anche inserire entrambi i menù nella stessa sezione se il modello lo permette. Per verificarlo cerchiamo su Modello > Modifica HTML la sezione in oggetto

In questo caso come vedete è presente l'attributo  maxwidgets='1' che consente l'inserimento di soltanto un widget nella sezione. Basterà togliere 1 e lasciare in bianco in questo modo maxwidgets=' '  quindi si salva il modello e si potranno trascinare con il cursore entrambi i widget per posizionarli nella stessa sezione

in modo da avere i due menù uno sotto l'altro

Utilizzando gli strumenti Ispeziona Elemento di Chrome o Analizza Elemento di Firefox si possono personalizzare uno o entrambi i menù. Nel test preso in esame per esempio si potrebbe ridurre lo spazio tra i due menù incollando subito sopra alla riga ]]></b:skin> questo codice

#LinkList1 > div > ul {margin-top:-20px;}

che produce questo risultato


Altre modifiche e personalizzazioni le lascio alla intelligenza e alla creatività dei lettori.