fonte e creditos:http://gemablog-.blogspot.com/2009/02/anadir-enlazar-configurar-menus.html..." Anadir, enlazar, configurar menus" .red #slatenav { position: relative; display: block; height: 42px; font-size: 11px; font-weight: bold; background: url("http://4.bp.blogspot.com/_q4j3j-JA2ro/SZxBAeKAJMI/AAAAAAAAJRY/9tb-oskMBVM/s320/redslate_background.gif") repeat-x scroll left top transparent; font-family: Arial,Verdana,Helvitica,sans-serif; text-transform: uppercase; }Entre las consultas que recibo hay una que se repite constantemente, se trata de anadir un menu al blog y que enlace cualquier entrada o etiqueta.Lo primero que haremos sera buscar ese menu, hay muchas paginas donde hacerlo y seguro que ya teneis alguno en mente..red #slatenav { position: relative; display: block; height: 42px; background: url("http://4.bp.blogspot.com/_q4j3j-JA2ro/SZxBAeKAJMI/AAAAAAAAJRY/9tb-oskMBVM/s320/redslate_background.gif") repeat-x scroll left top transparent; text-transform: uppercase; font: 700 11px Arial,Verdana,Helvitica,sans-serif; }.red #slatenav ul { margin: 0pt; padding: 0pt; list-style-type: none; width: auto; }.red #slatenav ul li { display: block; float: left; margin: 0pt 1px 0pt 0pt; }.red #slatenav ul li a { display: block; float: left; color: rgb(254, 204, 195); text-decoration: none; padding: 14px 22px 0pt; height: 28px; }.red #slatenav ul li a:hover, .red #slatenav ul li a.current { color: rgb(255, 255, 255); background: url("http://3.bp.blogspot.com/_q4j3j-JA2ro/SZxA-JrwdpI/AAAAAAAAJRM/rgRr9r3LFL8/s000/redslate_backgroundOVER.gif") no-repeat scroll center top transparent; }HomeEtiqueta1Etiqueta2Etiqueta3Vamos a anadir un menu con CSS esto quiere decir que consta de los estilos y el codigo para los enlaces unicamente.Para ejemplo anadi el que veis en la parte superior de la entrada.Los estilos los anadiremos justo antes de ]]></b:skin>.red #slatenav {position: relative;display: block;height: 42px;background: transparent url(url-de-imagen-gif) repeat-x top left;text-transform: uppercase;font: bold 11px Arial, Verdana, Helvitica, sans-serif;}.red #slatenav ul {margin: 0;padding: 0;list-style-type: none;width: auto;}.red #slatenav ul li {display: block;float: left;margin: 0 1px 0 0;}.red #slatenav ul li a {display: block;float: left;color: #FECCC3;text-decoration: none;padding: 14px 22px 0;height: 28px;}.red #slatenav ul li a:hover,.red #slatenav ul li a.current {color: #fff;background: transparent url(url-de-imagen-HOVER.gif) no-repeat top center;}En este menu tenemos dos imagenes: La opacidad El efecto hoverPara anadirlas estas o cualquier otra imagen nos fijaremos que el nombre de la imagen corresponda con el lugar donde tenemos que anadirla en los estilos del menu.Es decir, guardamos o descargamos las imagenes a nuestro PC las subimos a nuestro servidor o a una entrada del blog que dejaremos en borrador y copiamos la url de la imagen para anadirla en el sitio que corresponda.Podria ser que no contenga imagenes y que en lugar de decir background: transparent url(url-de-cualquier imagen);fuera un color en este caso seria algo asi background:#ccc; o background-color:#ccc; eso nos daria la posibilidad de sustituir el color por cualquier otro.Ya tenemos el codigo de los estilos en la plantilla, las imagenes anadidas o el color de nuestro agrado.Guardamos los cambios y nos situamos en plantilla de diseno, alli editamos un nuevo gadget y escogemos la pestana de HTML...En las paginas de menus tambien nos proporcionan el codigo HTML para los enlaces del menu, para este del ejemplo es el siguiente:<div class="red"><div id="slatenav"><ul><li><a href="url-pagina" class="current" title="descripcion">Home</a></li><li><a href="url-pagina" title="descripcion">Enlace1</a></li><li><a href="url-pagina" title="descripcion">Enlace2</a></li><li><a href="url-pagina" title="descripcion">Enlace3</a></li></ul></div></div>*Donde dice url-pagina anadimos la url de la pagina que vamos a enlazar.*En descripcion es el texto que se muestra al pasar el cursor sobre el enlace.*El texto Home lo anadi para tener una pagina de inicio.*Etiqueta1- 2- 3 seran el nombre de los enlaces, es decir el texto que visualizamos.Completamos esos detalles y guardamos los cambios para