Menu Desplegable




Buscar: <b:section class='header'
 Y poner:
<b:section class='header' id='header' maxwidgets='10' showaddelement='yes'>
        <b:widget id='Header1' locked='false' title='AQUÍ APARECE EL NOMBRE DE VUESTRO BLOG' type='Header'>
      <b:includable id='main'>

Buscar]]></b:skin>
Añadir:


#mbwnavbar {
background: #fff;
width: 1030px;
color: #ea9999;
margin: 0px;
padding: 0;
position: relative;
border-top:0px solid #960100;
height:35px;
}
#mbwnav {
margin: 0;
padding: 0;
}
#mbwnav ul {
float: left;
list-style: none;
margin: 0;
padding: 0;
}
#mbwnav li {
list-style: none;
margin: 0;
padding: 0;
border-left:1px solid #fff;
border-right:1px solid #fff;
height:35px;
}
#mbwnav li a, #mbwnav li a:link, #mbwnav li a:visited {
color: #;
display: block;
font:normal 12px Arial, sans-serif; margin: 0;
padding: 9px 12px 10px 12px;
text-decoration: none;
}
#mbwnav li a:hover, #mbwnav li a:active {
background: #fff;
color: #ea9999;
display: block;
text-decoration: none;
margin: 0;
padding: 9px 12px 10px 12px;
}
#mbwnav li {
float: left;
padding: 0;
}
#mbwnav li ul {
z-index: 9999;
position: absolute;
left: -999em;
height: auto;
width: 160px;
margin: 0;
padding: 0;
}
#mbwnav li ul a {
width: 140px;
}
#mbwnav li ul ul {
margin: -25px 0 0 161px;
}
#mbwnav li:hover ul ul, #mbwnav li:hover ul ul ul, #mbwnav li.sfhover ul ul, #mbwnav li.sfhover ul ul ul { left: -999em;
}
#mbwnav li:hover ul, #mbwnav li li:hover ul, #mbwnav li li li:hover ul, #mbwnav li.sfhover ul, #mbwnav li li.sfhover ul, #mbwnav li li li.sfhover ul {
left: auto;
}
#mbwnav li:hover, #mbwnav li.sfhover {
position: static;
}
#mbwnav li li a, #mbwnav li li a:link, #mbwnav li li a:visited {
background: #fff;
width: 120px;
color: #ea9999;
display: block;
font:normal 12px Comic Sans MS, sans-serif;
margin: 0;
padding: 9px 12px 10px 12px;
text-decoration: none;
z-index:9999;
border-bottom:1px dotted #fff;
}
#mbwnav li li a:hover, #mbwnavli li a:active {
background: #fff;
color: #ea9999;
display: block; margin: 0;
padding: 9px 12px 10px 12px;
text-decoration: none;
}


Gadget HTML:

<div id='mbwnavbar'>
      <ul id='mbwnav'>
        <li>
          <a href='URL'>Nombre de pestaña</a>
        </li>
        <li>
          <a href='URL'>Nombre de pestaña</a>
       </li>
        <li>
          <a href='URL'>Nombre de pestaña</a>
        <ul>
                <li><a href='URL'>Nombre subpestaña</a></li>
<li><a href='URL'>Nombre subpestaña</a></li>
<li><a href='URL'>Nombre subpestaña</a></li>
                <li><a href='URL'>Nombre subpestaña</a></li>
<li><a href='URL'>Nombre subpestaña</a></li>
            </ul>
         </li>
<li>
           <a href='URL'>Nombre de pestaña</a>
                   </li>
      </ul>
    </div>

Para añadir mas pestañas:
<a href='URL'>Nombre de pestaña</a>

Para añadir mas subpestañas:
<li><a href='URL'>Nombre subpestaña</a></li>

57 comentarios:

  1. Este comentario ha sido eliminado por el autor.

    ResponderEliminar
  2. Respuestas
    1. A ti por comentar, perdona que no lo había leido antes :(

      Eliminar
    2. disculpame, pero cuando pongo ]]> no me sale. Ya probé con buscar en otros widgets, o blogheader1, etc y no me aparece. me serviría tu ayuda

      Eliminar
  3. muy buena herramienta, MUCHAS GRACIAS!

    ResponderEliminar
  4. como puedo poner la flecha que salga algo animado ??

    ResponderEliminar
    Respuestas
    1. Hola, el video 26 del canal habla sobre eso: http://www.youtube.com/playlist?list=PLxrlSPzTYmSweRY4a2adrDLHrHX77ebTm

      Eliminar
  5. Tengo un problema... el menu se me crea, pero el desplegable no! como lo puedo solucionar?

    ResponderEliminar
    Respuestas
    1. Hola, yo tengo el mismo problema,solo me aparecen las pestañas pero no me despliega las sub pestañas, AYUDA POR FAVOR !!!

      Eliminar
  6. como lo ago mas dinamico hay algun video mas de eso quiero saber cuanta gente ve vi blog el numero de visita osea un contador de visitas griacias espero respondan

    ResponderEliminar
    Respuestas
    1. Hola, sobre este menu solo tengo este video, en el explico como modificar colores... Y lo del contador de visitas, cuando vas a diseño/añadir gadget/ busca el que se llama contador de visitas o algo asi, ahi escoges el que más te guste y lo guardas. saludos

      Eliminar
  7. Muchas muchas gracias, al fin un vídeo bien explicado de lo que se deseaba, sobre todo para quienes no tenemos mucha pericia en estas cosas, estoy creando un nuevo blog y me a servido muchisimo. Desde ya su seguidora.

    ResponderEliminar
    Respuestas
    1. Hola Paola. Me alegro de que te haya servido. Gracias por comentar, suerte con el blog :D

      Eliminar
  8. Muchas gracias! Me ha servido y te agradezco que en el vídeo se explique paso a paso.Y seguir con los tutoriales porque se explican muy bien y sirven de gran ayuda!.

    ResponderEliminar
    Respuestas
    1. Me alegro de que haya servido Reyes, gracias por comentar. saludos :)

      Eliminar
  9. una duda ya puse todo pero cuando otra ves me meti para agregarle otra pestaña como tu dijiste no me sale alado de las otras sino namas las letras y ninguna subpestaña que ago?

    ResponderEliminar
  10. Muchas gracias por tu aporte, la verdad es que es de gran ayuda, pero tengo un problema y tal y como se me presenta, para mi algo gordo. He hecho lo de los menús desplegables, hasta ahí todo perfecto, pero es que la letra que tiene es muy pequeña, entonces intento cambiarla a 18px, y al hacer esto, dejan de salirme los menús desplegables. Supongo que será que hay que agrandar el tamaño de los botones del menú, cosa que no se hacer. Aquí te dejo la dirección del blog, a ver si tiene remedio o tengo que dejar la letra más pequeña. Muchas gracias y seguid así, que gracias a vosotros los "inutiles" de esto nos salvamos un poco jejejejej. Gracias. http://eltrasterodeangel.blogspot.com.es/

    ResponderEliminar
  11. Hola, me gustan mucho vuestros vídeos, lo explicáis muy sencillo, muchas gracias.
    Con este tutorial, solo empezar ya he tenido problemas jaaajaj, no encuentro ]]> y ya he provado todo lo que dices en el vídeo. Ayudaaaa.
    Muchas gracias.

    ResponderEliminar
  12. Hola ¿Qué tal? Disculpa cómo le puedo añadir sub pestañas a las sub pestañas? ¿Es posible?

    ResponderEliminar
  13. Como puedo ponerla verticalmente y Gracias me a sido de gran ayuda sus tutoriales Saludos!!!

    ResponderEliminar
  14. gracias continuo usando su pagina

    muy buena e instructiva

    ResponderEliminar
  15. Hola, Muchas gracias por la ayuda, pero hay algo que no funciona bien. Al abrir el desplegable y quererme poner encima desaparece. Los enlaces funcionan, pero tengo que ir suuuuuuper rapido para tocar donde quiero. Que puedo hacer para que el desplegable no desaparezca a menos que salga fuera?
    Grácias

    ResponderEliminar
  16. Hola, no encuentro esto <b:section class='header' .. En mi plantilla, qué puedo hacer?
    No sale con el buscador (Ctrl+F)

    ResponderEliminar
    Respuestas
    1. Hola Orlando, la única solución es buscarlo manualmente. vas bajando hasta que lo encuentres...saludos

      Eliminar
  17. Hola una pregunta.... no entendí lo de la url. que url hay que copiar ? de donde se saca ? ayuda por favor lo necesito rapido

    ResponderEliminar
  18. HOLA.
    TENGO UN PROBLEMA, NO ME APARECE EN LA
    PLANTILLA HTML Buscar; ]]> , es decir la 2ª parte de buscar ( no se por qué pero no me deja escribirlo aquí )
    LO HE BUSCADO DE LAS DOS FORMAS QUE DICE EL TUTORIAL Y AUN ASÍ NO ME APARECE.
    CÓMO PUEDO BUSCARLO? ES MUY IMPORTANTE PARA MI PODER HACER UN MENÚ DESPLEGABLE. ME PUEDE AYUDAR ALGUIEN POR FAVOR.
    GRACIAS.

    ResponderEliminar
    Respuestas
    1. Hola Ana.
      Debes ir bajando y buscandolo, si no te sale con el buscador no hay otra opción que ir buscandolo...saludos

      Eliminar
  19. Si que tienes seguidores y no es para menos el video es de mucha ayuda para los novatos como yo, solo te recomendaria mejorer el uso del zoom cuando estas explicando hay una parte del video que quieres mostrar algo arriba de tu pantalla y no se... un gran saludo!

    ResponderEliminar
  20. Hola!

    Este tutorial es muy bueno, pero tengo un problema... He creado el menú desplegable sin problema, pero solo me aparece la primera subpestaña que he puesto... ¿Como hago para que me aparezcan todas? Lo he revisado varias veces y nada...

    Saludos

    ResponderEliminar
    Respuestas
    1. Hola, es la ultima o la primera entrada? tienes algo bajo que lo pueda bloquear?saludos

      Eliminar
  21. Hola, muy buenos los totorales. Me gustaría saber cómo puedo mover el menú desplegable, cambiar su posición más hacia arriba. GRACIAS

    ResponderEliminar
    Respuestas
    1. Hola Nazaret, Debes mover el gadget donde quieras que aparezca. saludos

      Eliminar
    2. el gadget del menú lo tengo debajo de la cabecera, pero me sale pegado. Me gustaría que hubiera una separación entre la cabecera y el gadget donde va el menú desplegable. Gracias

      Eliminar
  22. Este comentario ha sido eliminado por el autor.

    ResponderEliminar
  23. No puedo cambiar el color de fondo de las pestañas AYUDA!!!
    http://elblogdeoneesan.blogspot.com :C

    ResponderEliminar
  24. Este comentario ha sido eliminado por el autor.

    ResponderEliminar
  25. Hola, estoy intentando configurar las subpestañas tal y como indica el video, pero no se porque razón ahora no me da la posibilidad de añadir un gadget y configurar el HTML/JavaScript. Estoy en la pagina de Diseño y tengo los modulos que he hecho y otros que dice "Añadir gadget". Pulso ahí para añadirle el configurador HTML y no me sale la opción de configurar el gadget! He probado a cerrar el blog y volver a entrar por si se había atascado, pero no ha funcionado...¿qué puede ser?

    ResponderEliminar
    Respuestas
    1. Hola. creo que algo falla.. no entiendo lo que dices. No conozco a nadie que no pueda agadir un gadget html JavaScript, no se que puede ser, es muy raro...

      Eliminar
  26. He encontrado la solución, las ventanas se me estaban abriendo, pero en otro lado. Sigo con la tarea! Saludos

    ResponderEliminar
  27. hola que tal, yo tengo un menú desplegable ya, pero me gustaria saber como hago para crear varias entradas en una sección, por ejemplo que el menu se abra y cuando le den a tortas salgan varios enlaces de recetas, cómo se haría eso

    ResponderEliminar
    Respuestas
    1. Ya te he contestado en el comentario que me has dejado en el vídeo, vídeo 47 muestro como sacar la url de una etiqueta y esa es la que tienes que utilizar.
      https://www.youtube.com/playlist?list=PLxrlSPzTYmSweRY4a2adrDLHrHX77ebTm

      Eliminar
  28. como añado subpestañas a las subpestañas? XD

    ResponderEliminar
  29. hola queria comentarte que cuando pongo ]]> no me sale y e probao de las 2 opciones como usted dice.

    ResponderEliminar
  30. Hola, agradezco mucho vuestra ayuda!! El problema es que lo he hecho tal como dices, pero me aparecen en pestañas, no hay desplegable. ¿Como puedo solucionarlo? Te dejo el enlace para que lo veas enmihistoria.blogspot.com Muchas gracias

    ResponderEliminar
  31. Hola Estoy Creando mi bog ya ise lo que me dijistes me dices como puedo escribir cuando entro a una subpestaña me sale lo siento no hay nada escrito en este blog que ago?

    ResponderEliminar
    Respuestas
    1. Hola, primero tienes que crear la entrada y luego esa url ponerla en el submenú. saludos

      Eliminar
  32. GRACIAS POR TU APORTE AMIGA BUENO ESPERO QUE ME AYUDES PARA MIS PROYECTOS ESTE MI CORREO alegre.cayetano@gmail.com

    ResponderEliminar
  33. Este comentario ha sido eliminado por el autor.

    ResponderEliminar
  34. Este comentario ha sido eliminado por el autor.

    ResponderEliminar
  35. Hola
    he seguido los pasos para hacer los menús desplegables y todo fenomenal, pero me gustaría tener más de dos niveles como indicas en el vídeo.
    Como puedo tener más niveles.
    Gracias, un saludo

    ResponderEliminar