Menu horizontal para blogger

Sacado de Ciudad Blogger. Allí encontrarás muchos trucos y tutoriales para tu blog.


Entra a Diseño > Edición de HTML y antes de ]]> pega lo siguiente:

/* Menú horizontal
----------------------------------------------- */
#menulineup {
padding: 0;
width: 100%;
border-top: 5px solid #D10000; /*Color de la línea superior*/
background: transparent;
}

#menulineup ul{
margin:0;
margin-left: 40px; /*Margen izquierdo entre la primera pestaña y el borde*/
padding: 0;
list-style: none;
}

#menulineup li{
display: inline;
margin: 0 2px 0 0;
padding: 0;
text-transform:uppercase;
}

#menulineup a{
float: left;
display: block;
font: bold 12px Arial;
color: black;
text-decoration: none;
margin: 0 1px 0 0; /*Margen entre cada pestaña*/
padding: 5px 10px 5px 10px;
background-color: lightblue; /*Color de las pestañas*/
border-bottom: 8px solid white;
}

#menulineup a:hover{
background-color: #D10000; /*Color de las pestañas al pasar el cursor*/
padding-top: 10px;
padding-bottom: 0;
border-bottom-color: #D10000; /*Color del borde inferior al pasar el cursor*/
color: white;
}

Ahora entra a Diseño > Elementos de la página > Añadir un gadget, selecciona HTML/Javascript y ahí pega esto:

• URL del enlace">Título 1
• URL del enlace">Título 2
• URL del enlace">Título 3
• URL del enlace">Título 4
• URL del enlace">Título 5

Ya sólo arrastra el elemento HTML/Javascript hasta abajo de la cabecera y cambia las URL de los enlaces y los títulos de las pestañas.

Puedes modificar los colores del menú a tu gusto; en el primer código he puesto las indicaciones para que sepas dónde hacer los cambios.