Planeta Blogger les trae un menú vertical muy interesante que les gustará instalar en su blog.
Este bonito menú lo encontramos en Mil Trucos Blogger, (a quien agradecemos) el cual se puede instalar en la Sidebar del blog. Luce muy bien por lo que seguramente será atractivo a nuestros visitantes.
También funciona perfectamente en páginas web.
Para ponerlo en nuestro blog, nos vamos a Diseño
/ Añadir Gadget / HTML/JavaScript:
En la ventana que nos presenta, pegamos
lo siguiente:
<style>
#button {
width: 12em;
border-right: 1px solid #000;
padding: 0 0 1em 0;
margin-bottom: 1em;
font-family: 'Trebuchet MS', 'Lucida Grande',
Verdana, Arial, sans-serif;
background-color: #90bade;
color: #333;
}
#button
ul {
list-style: none;
margin: 0;
padding: 0;
border: none;
}
#button li {
border-bottom: 1px solid #90bade;
margin: 0;
list-style: none;
list-style-image: none;
}
#button li a {
display: block;
padding: 5px 5px 5px 0.5em;
border-left: 10px solid #1958b7;
border-right: 10px solid #508fc4;
background-color: #2175bc;
color: #fff;
text-decoration: none;
width: 100%;
}
html>body
#button li a {
width: auto;
}
#button
li a:hover {
border-left: 10px solid #1c64d1;
border-right: 10px solid #5ba3e0;
background-color: #2586d7;
color: #fff;
}
</style>
<div
id="button">
<ul>
<li><a href=" URL de la página
">Inicio</a></li>
<li><a href=" URL de la página ">Tutoriales</a></li>
<li><a href=" URL de la página ">Gadget</a></li>
<li><a href=" URL de la página ">Imágenes</a></li>
<li><a href=" URL de la página ">Noticias</a></li>
<li><a href=" URL de la página ">Trucos</a></li>
<li><a href=" URL de la página ">Nosotros</a></li>
<li><a href=" URL de la página ">Contacto</a></li>
</ul>
</div>
Para terminar, debemos cambiar lo que está
en Azul, por las URL de la página a mostrar y
donde está en Rojo personalizar los títulos de los botones.
En donde está en Café podemos cambiar el color del fondo poniendo otro valor.
Le agradecemos su visita, al tiempo que
le pedimos nos deje un recuerdo a través de sus comentarios.
