Crear Menú desplagable online

Hola a todos bienvenidos una vez más a mi blog, en esta ocasión les voy a enseñar a poner un menú desplegable en su blog, ya que muchos lo han preguntado espero que les guste :). Antes de ver el siguiente tutorial tienes que crear una copia de tu plantilla!! (como hacerlo aquí) Este menú desplegable lo crearemos en linea para encontrar ya hecho y solo encontrar el que nos guste y encaje con nuestro blog o página web.

Por cierto para algunos puede ser que no les funcione por el tipo de plantilla, de hecho este tutorial sólo funciona par aquellos que tienen una plantilla simple, las otras como Awesome Inc, Vistas Dinamicas, etc primero tenemos que hacer un cambio a la plantilla aqui te dejo el link :) De ahi los demás pasos a seguir son iguales.

Pasos
1. Crear una copia de seguridad de la plantilla sin este paso no pueden avanzar al siguiente. (porque vamos a modificar el código HTML agregando un CSSy borramos o penemos algo mal, nuestro blog se arruinará para siempre D:)
2. Ir a cualquiera de las siguientes páginas:

• http://cssmenumaker.com/
• http://www.cssmenubuilder.com/home
• http://purecssmenu.com/
• http://css3menu.com/index.html (descargar programa)
• http://www.free-css.com/free-css-menus/page1

para algunas páginas es necesario inscribirse antes para poder descargar tanto el código HTML como el CSS3.

3. Ahora nos dirigimos a nuestro Blog en "Plantilla" y crear copia de seguridad
4. Nos vamos a la opción de "Editar HTML" y buscamos con "CTRL+F"  dentro de la caja de códigos lo siguiente:

]]></b:skin>

5. Y justo antes de ]]></b:skin> vamos a poner /*menu desplegable/ y pegamos el código Css que es el estilo de nuestro nuevo menú, si alguna vez lo quisiéramos cambiar es más sencillo buscar las palabras menú desplegable y cambiarlo, deben fijarse que si a veces no funciona es porque le falta al principio del código <style> y al final </style> y para terminar el código agregar /*fin menu desplegable/ para poderlo ubicar bien.
6. Ahora nos dirigimos a "Diseño"  y agregamos un Gadget o Widget de HTML y pegamos el código de los links y submenus, por lo regular es el que inicia con <div id= .....>

Si no han creado el código de HTML en la página donde lo descargaron lo mejor es crearlo en la primera página que les puse como link, pero si quieren hacerlo manualmente les dejo a continuación como cambiarlo conforme a sus links les dejo este tutorial.

7. Guardamos los cambios y vemos si es de nuestro agrado, si no les gustará o se llegará a desconfigurar siempre pueden restaurar su copia de seguridad previa, he ahi la importancia.

Para todos aquellos que conocen y pueden modificar los códigos CSS les va a ser fácil editar los menús prediseñados. Espero que les sirva mucho y cualquier duda no olviden en comentar :)

PD: les aconsejo ir guardando sus copias de seguridad en dado caso quisieran iniciar de nuevo o regresar a su antigua plantilla.

Fuente: Ciudadblogger

te puedes ayudar con los siguientes videos parte 1 y parte 2: