Menú vertical Verde (Ayuda web)

En el balcón de Jaime he descubierto este magnífico menú para blogger. Se trata de otro magnífico menú para tu blogspot para que puedas crear un orden en tu blog para colocar las entradas que consideres más importantes o para crear una ruta de navegación para tus lectores.

Para poner este menú en tu blog sigue los siguientes pasos:

1) Vamos a Diseño

2) Edición de HTML

3) Busca ]]></b:skin> (teclea Ctrl + F para buscar más rápido)

4) Justo arriba de ]]></b:skin> pega el siguiente código:

Código:

/* Menu Green Bubble<br /> ---------------- */<br /> #Greenbubble {<br /> padding:0;<br /> width:150px;<br /> margin:10px 0 0 10px;<br /> }<br /> <br /> #Greenbubble ul {<br /> float:right;<br /> margin:0;<br /> padding:0;<br /> list-style-image:none;<br /> list-style-position:outside;<br /> list-style-type:none;<br /> }<br /> #Greenbubble li a {<br /> display:block;<br /> margin:0 0 10px;<br /> background:transparent url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi_YeTWz6aOahjCXYkwtQjYxgtuWdSzonVsyRWbsUQZxy9G7u2ksnJhAlpoWMoQRX9U4A315h_V3AO3mCZDEqKSacGOCPXg9N0sMQtgcAthU3jFUTlLNy2yi2V2Gk8ZPJsEcAxkjBLqmJ0/s1600-r/greenbubble.png) no-repeat scroll 0 0;<br /> background-position: -22;<br /> color: #ffffff;<br /> font-family: Tahoma;<br /> font-size: 13px;<br /> height: 21px;<br /> padding: 2px 0 0 30px;<br /> width: 122px;<br /> }<br /> #Greenbubble li a:hover {<br /> color:#FFFFFF;<br /> font-family: Tahoma;<br /> font-size: 13px;<br /> height: 21px;<br /> text-decoration:none;<br /> background-position: 0px -23px;<br /> }<br /> <br /> /* Fin menu Green Bubble<br /> ----------- */

5) Clica en vista previa y si no hay ningún problema, guarda tu plantilla.

6) Ahora ves a Diseño->Elementos de página->
Añadir un gadget->

HTML/Javsscript.

En él pega el siguiente código:

Código Menús donde van Nombre y Link:

<div id="Greenbubble"> <ul> <li><a href="URL DE LA PAGINA" _fcksavedurl="URL DE LA PAGINA" >TITULO</a></li> <li><a href="URL DE LA PAGINA" _fcksavedurl="URL DE LA PAGINA" >TITULO</a></li> <li><a href="URL DE LA PAGINA" _fcksavedurl="URL DE LA PAGINA" >TITULO</a></li> <li><a href="URL DE LA PAGINA" _fcksavedurl="URL DE LA PAGINA" >TITULO</a></li> </ul> </div>


Sustituye URL DE LA PAGINA por la URL correspondiente de la página o entrada que quieras enlazar. Después en TITULO pon el nombre que desees dar a ese enlace.


Para añadir más enlaces, fíjate en la estructura y añade esta línea:

Código:

<li><a href="URL DE LA PAGINA" _fcksavedurl="URL DE LA PAGINA" >TITULO</a></li>

---

No olvides comentar si re gusto y recomendarlo a tus amigos Web Master.

---