Questions About Blogger (3) Como poner un menú horizontal en el blog

2 mar. 2011

¡Bienvenidos a un nuevo Questions About Blogger! La sección en la que os daré los truquitos necesarios para cambiar o diseñar cualquier cosa de vuestro blog. Hoy Mikki hace la siguiente pregunta: ¿Cómo se pone un menú horizontal en el blog? Veámoslo gracias al maravilloso espacio El Escaparate de Rosa. También podéis acudir ahí para cualquier tipo de duda :) Empecemos:

1.Vais a www.blogger.com > Escritorio > Diseño > Editar HTML.
2. Una vez en vuestra plantilla, deberéis buscar en ella lo siguiente: está a simple vista y todas las plantillas lo tienen, así que paciencia :)
3. Una vez encontrado, pegaréis antes de el siguiente código:

#navcontainer ul

{

text-align: center;

padding-bottom: 5px;

padding-top: 5px;

padding-left: 0;

margin-top: 0;

/* cancels gap caused by top padding in Opera 7.54 */

margin-left: 0;

background-color: #C0C0C0;

color: white;

width: 100%;

font-family: Arial,Helvetica,sans-serif;

line-height: 18px;

/* fixes Firefox 0.9.3 */



}



#navcontainer ul li

{

display: inline;

padding-left: 0;

padding-right: 0;

padding-bottom: 5px;

/* matches link padding except for left and right */

padding-top: 5px;

background-color: #333399;

}



#navcontainer ul li a

{

padding-left: 10px;

padding-right: 10px;

padding-bottom: 5px;

padding-top: 5px;

color: white;

text-decoration: none;

border-right: 1px solid #fff;

}



#navcontainer ul li a:hover

{

background-color: #CC3300;

color: white;



}



#navcontainer #active { border-left: 1px solid #fff;

}

Este código es el que sirve para cambiar los colores de vuestro menú, los colores de la fuente, el tipo de fuente etc.

4. Una vez tengáis eso, seguid vagando por vuestra plantilla hasta encontrar: y justo a continuación pegáis este otro código:




Como véis está configurado según Rosa, la dueña del tutorial, lo puso. Deberéis cambiar los links que tiene ella a sus páginas, por los links a vuestras entradas o páginas y los títulos de ella (Cosas mías, botón de enlace...etc), por las palabras que vosotros queráis poner: Reseñas, Curiosidades, etc.

¡Y ya lo tendréis!

Por supuesto podéis hacer vuestras preguntas y pedidos de temas para que aparezcan en esta sección escribiéndome un mail a: thegirlins@hotmail.com las preguntas solo las resolveré en esta sección del blog ;) ¡Muchas gracias a todos!

QAB o Questions About Blogger es una sección que ayuda a los principiantes y veteranos bloggeros a mejorar o aprender cosas sobre blogger. Es una sección original del blog, que podéis llevaos tal cual al vuestro, dando los créditos pertinentes.


{ 6 Nubes... léelas aquí abajo o... ¡deja la tuya! }

  1. Muchas gracias por el tuto linda!

    ResponderEliminar
  2. creo q m será muy util >< thanks

    ResponderEliminar
  3. Merci! tenerlos todos estos tutoriales por aquí es genial! :) Besotes y saludotes blogisticos!

    ResponderEliminar
  4. graciias estaba buscando por internet como poner uno, son geniales los tutoriales y muy utiles, por cierto me he hecho un nuevo blog y lo tengo casi vacio asi que si te pasaras lo agradeceria mucho =D.

    ResponderEliminar
  5. Alguien me ayuda??? No encuentro lo de div id content... etc!!!
    Alguien sabe si es que yo no lo tengo o es que no lo he encontrado???

    ResponderEliminar
  6. Ayer te puse un comentario aquí, pero se ve que no se guardo o algo, pero en fin, muchas gracias pro el tutorial, otra vez xDD

    He tardado demasiado en comentar (¿una semana quizás? xD)

    P.D.: Tengo ya tu dibujo, cuando pueda te lo mando :D

    ResponderEliminar

- Copyright © * De Profesión Soñadora: Mundotaku, 'Loliteces', Manga y Anime, curiosidades...y mis desvaríos. - Powered by Blogger - Designed by Johanes Djogan - Modified by Mery and Bella