Aggiungere una barra di navigazione del menu in alto per un blog di Blogger, anche se l'interfaccia del blog attualmente visualizzato in un vecchio stile di Blogger. Blogger aggiornato l'interfaccia che gli utenti modificare loro blog nel 2010, che consente maggiore accesso al codice HTML per il design del blog. Blogger, questa interfaccia viene aggiornato automaticamente quando i titolari di conto che non hanno effettuato l'accesso dal roll out accedere a Blogger, al punto che è possibile incollare nel codice HTML per il menu di navigazione superiore.

Istruzioni

1

Iscriviti a Blogger utilizzando le credenziali dell'account di Google. Fare clic sul pulsante di "Design" sotto il nome del blog che si desidera modificare.

2

Fare clic sul pulsante "Aggiungi Gadget", quindi selezionare "Text/HTML". Incollare il codice seguente nel campo vuoto:

< ul >
< li >< un href="page1.html" > navigazione opzione 1 < /a >< / li >
< li >< un href="page2.html" > navigazione opzione 2 < /a >< / li >
< li >< un href="page3.html" > navigazione opzione 3 < /a >< / li >
< li >< un href="page4.html" > navigazione opzione 4 < /a >< / li >
</UL >

Sostituire i titoli e il link di esempio con l'effettivo URL e titoli delle pagine. Aggiungere gli elementi aggiuntivi < li >< / li > per aggiungere ulteriori collegamenti al menu di navigazione. Fare clic sul pulsante "Salva".

3

Selezionare "Modifica HTML". Scorrere verso il basso il < / b:skin > elemento e cliccare con il mouse sulla linea prima di questo codice. Incollare il codice riportato di seguito:

.basictab () {
padding: 3px 0;
margin-left: 0;
carattere: grassetto Verdana 12px;
border-bottom: 1px solid gray;
list-style-type: none;
text-align: left;
}

.basictab li {
display: inline;
margin: 0;
}

.basictab li a {
Proprietà Text-decoration: none;
padding: 3px 7px;
margine destro: 3px;
border: 1px solid gray;
border-bottom: nessuno;
colore di sfondo: #f6ffd5;
colore: #2d2b2b;
}

li .basictab a: visited {
colore: #2d2b2b;
}

li .basictab un: hover {
colore di sfondo: #DBFF6C;
colore: nero;
}

li .basictab a: active {
colore: nero;
}

li. Selected .basictab un {/scheda selezionata effetto/
Posizione: relativo;
Top: 1px;
padding-top: 4px;
colore di sfondo: #DBFF6C;
colore: nero;
}

Modificare i codici per i colori, i nomi e dimensioni dei caratteri e altri elementi di stile del menu che si desidera modificare. Fare clic sul pulsante "Anteprima" per visualizzare in anteprima l'aspetto del menu sul tuo blog e apportare le modifiche necessarie. Fare clic su "Salva modifiche" quando si è pronti per apportare le modifiche finali.