27 sept. 2015

Cómo crear un menú con submenús en Blogger sin tener experiencia en informática o programación


Crear un menú en cualquier Blog es algo fundamental para organizar nuestros contenidos de manera que podamos presentarlos a nuestros usuarios de una manera estructurada y sencilla.

Hemos tratado con anterioridad cómo crear un menú sencillo en Blogger sin tener ninguna experiencia en programación, con simples opciones que agrupan entradas bajo las etiquetas de tu Blog y que se puede poner con suma facilidad.

En esta ocasión haremos de la manera más sencilla posible un menú con diversos submenús que permitan ampliar aún más la manera de organizar y exponer los contenidos en nuestro Blog.

¿Cómo vamos a crear un menú con submenús en Blogger?


El menú se forma por medio de dos elementos fáciles de entender:
- El Estilo o presentación del menú que se realiza mediante hojas de estilos (css).
- La estructura del menú con sus opciones que se realiza programando un código muy sencillo de entender (HTML).
Vamos a utilizar ambos conceptos de manera que, incluso aunque nunca hayas hecho nada de programación, sepas utilizarlos sin problemas. Simplemente sigue cada paso que a continuación te enumero y monta tu propio menú con submenús en Blogger.

¿Qué tipos de menús podemos crear en un Blog?

Existen dos tipos de menús que suelen aparecer en cualquier Blog:

Menú simple


Básicamente un menú sin submenús, es un menú denominado "simple", es decir, que no tiene submenús y consta de un sólo nivel para organizar toda la información. Si quieres crear un menú sencillo, sin submenús y fácil de poner en tu Blog, no dudes en realizar esta guía paso a paso donde no tendrás ni que "tirar" una sola línea de código: Cómo poner un menú sencillo en blogger sin tener experiencia en informática o programación. Aquí tienes un ejemplo:

Menú con submenús


El menú con submenús, presenta los contenidos de una manera más estructurada que el menú simple, porque por cada categoría ofrece distintos niveles de información que se agrupan en lo que llamamos submenús o subopciones.

A continuación te ayudo paso a paso a crear tu propio menú con submenús en blogger.

Crea un menú con submenús en Blogger sin ser un experto en informática o programación:

1) Piensa en la estructura que le vas a dar a tu menú, cómo vas a conformar sus opciones y subopciones para ordenar tus contenidos y mostrárselos fácilmente a tus usuarios.
  • Para montar un menú, primero debes pararte a pensar en las categorías que van a organizar las entradas de tu Blog. Esas categorías serán las opciones del menú que vas a crear.
  • Cuando tengas claras las categorías que compondrán las opciones de menú, con ellas etiquetaremos cada entrada de tu Blog para que cuando pulsen en una determinada categoría, salgan todas las entradas que contienen su correspondiente etiqueta.
Un Ejemplo sencillo de organización en categorías basadas en etiquetas de tu Blog:
  • Pongamos por ejemplo que tienes un Blog de cocina y deseas estructuras tus entradas en las siguientes categorías:
  •  postres, carnes, verduras y pescados.
  • Ahora sólo queda que etiquetes cada entrada de tu Blog para que se agrupe en su etiqueta. En las entradas que tengan que ver con postres pondrás la etiqueta postres, en las de carnes usarás la etiqueta carnes y así sucesivamente.
¿Cómo etiqueto las entradas en Blogger?
  • Para poner la etiqueta adecuada en cada entrada simplemente dentro de Blogger ve a la opción del menú de la izquierda "Entradas":


  • Ahora pulsa "Editar" en la entrada deseada para acceder a ella (como cuando escribes normalmente):


  • En la parte derecha del editor de entradas, he marcado en la pantalla anterior la zona donde debes hacer "clic" para etiquetar tu entrada. En este caso imagina que dentro del Blog de cocina del ejemplo esta entrada la vamos a poner en la categoría "postres", pues bastaría con darle al icono con forma de etiqueta y después escribir la etiqueta "carnes" y pulsar guardar.
  • Esto debes hacerlo con cada entrada, de manera que queden todas etiquetadas con la categoría (opción de menú) que luego mostrarás en el menú de tu Blog.
2) Una vez planificado el menú y sus categorías, ya puedes entrar en Blogger y montarlo. Dentro de Blogger, dirigiros a la opción de menú "plantilla" y pulsad "Editar HTML".



3) En el código fuente de vuestra etiqueta añadid justo antes de la etiqueta "</head>" el siguiente código fuente que le da formato al menú (es la hoja de estilo), se trata de un menú de la web cssmenumaker.com que no requiere Javascript para funcionar. Cuando lo hayáis pegado salir guardando la plantilla:

<style type="text/css">#cssmenu2 ul {margin: 0; padding: 7px 6px 0; background: #7d7d7d url(http://cssmenumaker.com/sites/default/files/menu/96/overlay.png) repeat-x 0 -110px; line-height: 100%; border-radius: 1em; font: normal .8em/1.5em Arial, Helvetica, sans-serif; -webkit-border-radius: 5px; -moz-border-radius: 5px; border-radius: 5px; -webkit-box-shadow: 0 1px 3px rgba(0,0,0, .4); -moz-box-shadow: 0 1px 3px rgba(0,0,0, .4);}
#cssmenu2 li {margin: 0 5px; padding: 0 0 8px; float: left; position: relative; list-style: none; }
#cssmenu2 a,
#cssmenu2 a:link {font-weight: bold; color: #e7e5e5; text-decoration: none; display: block; padding:  8px 20px; margin: 0; border-radius: 5px; -webkit-border-radius: 5px; -moz-border-radius: 5px;  text-shadow: 0 1px 1px rgba(0,0,0, .3); }
#cssmenu2 a:hover {background: #000; color: #fff;}
#cssmenu2 .active a, 
#cssmenu2 li:hover > a {background: #666 url(http://cssmenumaker.com/sites/default/files/menu/96/overlay.png) repeat-x 0 -40px; color: #444; border-top: solid 1px #f8f8f8; -webkit-box-shadow: 0 1px 1px rgba(0,0,0, .2); -moz-box-shadow: 0 1px 1px rgba(0,0,0, .2); box-shadow: 0 1px 1px rgba(0,0,0, .2); text-shadow: 0 1px 0 rgba(255,255,255, 1); }
#cssmenu2 ul ul li:hover a,
#cssmenu2 li:hover li a {background: none; border: none; color: #666; -webkit-box-shadow: none; -moz-box-shadow: none;}
#cssmenu2 ul ul a:hover {background: #8f8f8f url(http://cssmenumaker.com/sites/default/files/menu/96/overlay.png) repeat-x 0 -100px !important; color: #fff !important; -webkit-border-radius: 5px; -moz-border-radius: 5px; border-radius: 5px; text-shadow: 0 1px 1px rgba(0,0,0, .1);}
#cssmenu2 li:hover > ul {display: block;}
#cssmenu2 ul ul {display: none; margin: 0; padding: 0; width: 185px; position: absolute; top: 40px; left: 0; background: #ddd url(http://cssmenumaker.com/sites/default/files/menu/96/overlay.png) repeat-x 0 0; border: solid 1px #b4b4b4; -webkit-border-radius: 5px; -moz-border-radius: 5px; border-radius: 5px; -webkit-box-shadow: 0 1px 3px rgba(0,0,0, .3); -moz-box-shadow: 0 1px 3px rgba(0,0,0, .3); box-shadow: 0 1px 3px rgba(0,0,0, .3);}
#cssmenu2 ul ul li {float: none; margin: 0; padding: 3px; }
#cssmenu2 ul ul a {font-weight: normal; text-shadow: 0 1px 0 #fff; }
#cssmenu2 ul:after {content: '.'; display: block; clear: both; visibility: hidden; line-height: 0; height: 0;}
* html #cssmenu2  ul {height: 1%;}</style>


4) Ahora, dirígete en Blogger a la pantalla principal y en el menú izquierdo de opciones pulsa en "Diseño" tal como muestro en la pantalla inferior.


5) Haz "clic" en cualquier punto donde ponga "Añadir un gadget", especialmente si se encuentra bajo la cabecera del título (CONSEJO: si lo pones en otro punto de la vista de diseño, el menú se adaptará a la forma de ese punto y no tendrá el aspecto alargado y horizontal).



6) En la vista de diseño y añadid un gadget <Javascript/HTML> donde queráis que resida el menú. Tratad de ponerlo en la parte más superior del Blog, justo debajo de la cabecera, por ejemplo.



7) Dentro del código del gadget HTML/Javascript, edita el código con la estructura del menú que deseas, aquí tienes un ejemplo de cómo debe formarse ese código:
<div id="cssmenu2">
<ul>
<li><a href="http://LA_URL_PRINCIPAL/index.html">Home</a></li>
<li class="has-sub "><a href="LA_URL_A_CATEGORÍA1">Tecnologia</a>
<ul>
<li><a href="LA_URL_A_SUBCATEGORÍA1">Product 1</a></li>
<li><a href="LA_URL_A_SUBCATEGORÍA2">Product 2</a></li>
</ul>
</li>
<li><a href="LA_URL_A_CATEGORÍA2">About</a></li>
<li><a href="LA_URL_A_CATEGORÍA3">Contact</a></li>
</ul>
</div>
<div id="cssmenu2"> Sirve para que el menú coja la presentación y aspecto que marcaban las hojas de estilo que pusiste en el paso 3).

Cada <li class="has_sub "> contendrá otros submenús o subopciones. Así pues en donde está la opción "Tecnología", hemos incluído dos subopciones: Product 1 y Product 2. El resto de enlaces del menú como Home, About o Contact permanecerán en la primera línea de opciones del menú.

El enlace a la página o a la instrucción "/search" (mirar ejemplo en menú de un sólo nivel) que nos sirve para localizar entradas con nombres de etiquetas determinados o nombres absolutos de las entradas ".html" a las que deseemos llamar. Tal como explicamos en el paso 1, cada search/ buscará las etiquetas que correspondan a las categorías que montaste. Cuando el usuario pulse sobre una opción con "search/etiqueta", se le aparecerán en pantalla todas las entradas del Blog que tengan esa etiqueta.

Después, tras el cierre de la etiqueta de "href", encontraremos el literal que desamos asignar a la opción del menú. Un "<li class="has-sub" indica que contiene subenlaces en su interior donde podremos poner por fin los subniveles con las temáticas en las que deseamos dividir la opción principal.

Un ejemplo de cómo preparar el código para adaptarlo a las opciones de menú que vayas a utilizar

Si quieres un ejemplo para ayudarte a montar tu código, es así de sencillo. Imagina que tienes un Blog de cocina y quieres dividir en dos categorías: Carnes y Pescados. Pero además, quieres que dentro de carnes aparezcan: platos con ternera, platos con cerdo... y en pescado: platos con lubina, platos de atún. Lógicamente quedaría organizado así:

Menu principal:
  • Carnes:
  • Platos con ternera
  • Platos con cerdo
  • Pescados:
  • Platos con lubina.
  • Platos con atún.
Su organización a código es tan sencilla como esto:

<div id="cssmenu2"><ul>
<li><a href="http://LA_URL_PRINCIPAL/index.html">Menu principal</a></li>
<li class="has-sub "><a href="URL_CATEGORÍA1/search/carnes">Carnes</a><ul><li><a href="URL_A_SUBCATEGORÍA1/serch/ternera">Platos con ternera</a></li><li><a href="URL_A_SUBCATEGORÍA2/search/cerdo">Platos con cerdo</a></li></ul><li class="has-sub "><a href="URL_A_CATEGORÍA2/search/pescados">Pescados</a><ul><li><a href="URL_A_SUBCATEGORÍA1/search/lubina">Platos con lubina</a></li><li><a href="URL_A_SUBCATEGORÍA2/search/atun">Platos con atún</a></li></ul></ul>
</div>
Así, tienes el mismo menú que en la parte superior pero traducido al sencillo código que meterías en tu Gadget HTML/Javascript según se explica en el paso 5 y 6. Después de /search/ va cada etiqueta que ordena cada concepto que agrupas por cada opción.

¡Eso es todo!, cualquier duda me tienes en los comentarios para ayudarte.

Escrito por Miguel García Sánchez - Colomer

Dispuesto a ayudarte con tu Blog en todo lo posible, Diarios de la nube es mi medio para llegar hasta ti. El conocimiento es universal, es del mundo, es de todos, esta es mi parte y la comparto contigo.

33comentarios:

  1. ¡Qué pena Miguel, ya te cambié el nombre!. I´m sorry!.

    ResponderEliminar
    Respuestas
    1. No hay problema. He eliminado el anterior comentario para que la gente no tenga el número, no publiques esas cosas que luego esto lo lee mucha gente ;)

      Yo probaría a montar el menú, tal cual de ejemplo directamente en la vista de diseño en la parte superior. Después ya avanzaría en el resto de tareas. Ve poco a poco y me vas preguntando lo que necesites.

      Un saludo.

      Eliminar
    2. Hola Miguel, una preguntota, ya pude crear los menús, pero por necesidad me interesa crear un tercer nivel, es decir, al poner el puntero del mouse en Tecnología, aparece Product 1 y Product 2, y quería poner sobre Product 1, para que me aparezca otras palabras, crees poder ayudarme???

      Eliminar
    3. Dentro del "has-sub" crea otro "has-sub". Es anidar dentro de la apertura y cierre de las etiquetas de submenú otro submenú... podrás hacerlo tantas veces como necesites.

      Un saludo!

      Eliminar
  2. Hola Miguel, gracias, gracias y muchas gracias por responder y por lo demás, estaba al pendiente. Voy por partes.
    1.- Ya tengo las categorías y he escrito ensayos para ver si funciona y efectivamente. Incluso la parte de "Sigue leyendo" y me envía al complemento del texto, pero está muy pequeño y muy a la izquierda.
    2.- Las páginas de mi plantilla (al final) tienen unos cuadritos, cuando les doy clic derecho-inspeccionar elemento, me dice: reditt, otro es icono de bookmark, etc...Ellos se quitan y se reemplazan por los íconos de las redes sociales?, yo ensayando puse uno de twitter con un huevito que se abre. Me encanta ese pero me sale en la barra lateral izquierda.
    3.- Cuando me voy a "diseño-main:entradas del blog-editar", le doy chulo en "mostrar botones para compartir", pero en la página no aparecen. Sólo los cuadritos raros que te digo.
    4.- En las categorías no pude hacer sub-menús y seguía paso a paso tus instrucciones , está simple.
    Quiero que veas mi plantilla porfa: http//:letrastintas.blogspot.com.co , también quiero los títulos en Arial y el texto en comic sans. Me gustaría enviarte un correo con un documento gráfico de alguna inquietudes. Será mucho pedir?Bueno, entonces seguiré en la lucha y de nuevo, en nombre de todos, muchas gracias, te vamos a enloquecer...je je je. Dios te guarde.

    ResponderEliminar
  3. Bueno, después de ésta pastoral te pedía auxilio pero ya no se por dónde. Al final recuperé mi correo y por ende el blog de prueba. O sea que el auxilio ya no cuenta. Seguimos con las dudas anteriores, de acuerdo?.
    Gracias, muchas gracias. Ahhh, mira el blog porfa.

    ResponderEliminar
    Respuestas
    1. Creo que lo que mejor podría venirte es utilizar una plantilla prediseñada y ponerla en tu Blog. Puedes ver ayuda para ello aquí: http://www.diariosdelanube.com/2013/11/personaliza-tu-plantilla-blogger.html

      En general, para retocar cada punto de una plantilla hace falta mucho conocimiento técnico, en tu caso seguro que te viene bien buscar una buena plantilla para Blogger que sea "responsive" y funcione en móviles y tabletas.

      Un saludo!

      Eliminar
  4. Hola Miguel, efectivamente tienes toda la razón. Descargué otra plantilla "responsive" y se deja editar sin problemas pero soy curiosa y le sigo haciendo cosas. Tengo una inquietud. Estoy diseñando "separadores de páginas" utilizando ppt y pixlr pero cuando investigo como ponerlo en el blog, me pide una "Url de imagen". Mi pregunta es y perdona mi ignorancia: ¿Cómo se obtiene la url de una imagen que uno crea?. Mil gracias por tu ayuda.

    ResponderEliminar
    Respuestas
    1. Esta guía te facilitará el trabajo con imágenes en Blogger:http://www.diariosdelanube.com/2015/04/como-utilizar-las-imagenes-en-blogger.html

      Cualquier cosa aquí estoy.

      Eliminar
  5. hola disculpa, ya puse el sub menu pero no se despliega o si lo hace no se visualiza en la pagina de mi blog aqui esta mi direccion y en el menu tecnologia no se despliega que sucede?

    http://secundariagla.blogspot.com.co/

    ResponderEliminar
    Respuestas
    1. ¡Hola Fernando!,
      pues ya casi lo tienes, porque lo demás está bien por lo que he visto ;) te falta meter el código del paso 3), lo mejor es que para tocarlo vayas desde el 1 al 3. ¡Con eso te funcionará sin problemas!. Cualquier cosa me dices.

      Un saludo y muchas gracias por participar.

      Eliminar
  6. Una duda...
    Se debe Copiar y pegar esto?
    type="text/css">#cssmenu2 ul {margin: 0; padding: 7px 6px 0; background: #7d7d7d url(http://cssmenumaker.com/sites/default/files/menu/96/overlay.png) repeat-x 0 -110px; line-height: 100%; border-radius: 1em; font: normal .8em/1.5em Arial, Helvetica, sans-serif; -webkit-border-radius: 5px; -moz-border-radius: 5px; border-radius: 5px; -webkit-box-shadow: 0 1px 3px rgba(0,0,0, .4); -moz-box-shadow: 0 1px 3px rgba(0,0,0, .4);}
    #cssmenu2 li {margin: 0 5px; padding: 0 0 8px; float: left; position: relative; list-style: none; }
    #cssmenu2 a,
    #cssmenu2 a:link {font-weight: bold; color: #e7e5e5; text-decoration: none; display: block; padding: 8px 20px; margin: 0; border-radius: 5px; -webkit-border-radius: 5px; -moz-border-radius: 5px; text-shadow: 0 1px 1px rgba(0,0,0, .3); }
    #cssmenu2 a:hover {background: #000; color: #fff;}
    #cssmenu2 .active a,
    #cssmenu2 li:hover > a {background: #666 url(http://cssmenumaker.com/sites/default/files/menu/96/overlay.png) repeat-x 0 -40px; color: #444; border-top: solid 1px #f8f8f8; -webkit-box-shadow: 0 1px 1px rgba(0,0,0, .2); -moz-box-shadow: 0 1px 1px rgba(0,0,0, .2); box-shadow: 0 1px 1px rgba(0,0,0, .2); text-shadow: 0 1px 0 rgba(255,255,255, 1); }
    #cssmenu2 ul ul li:hover a,
    #cssmenu2 li:hover li a {background: none; border: none; color: #666; -webkit-box-shadow: none; -moz-box-shadow: none;}
    #cssmenu2 ul ul a:hover {background: #8f8f8f url(http://cssmenumaker.com/sites/default/files/menu/96/overlay.png) repeat-x 0 -100px !important; color: #fff !important; -webkit-border-radius: 5px; -moz-border-radius: 5px; border-radius: 5px; text-shadow: 0 1px 1px rgba(0,0,0, .1);}
    #cssmenu2 li:hover > ul {display: block;}
    #cssmenu2 ul ul {display: none; margin: 0; padding: 0; width: 185px; position: absolute; top: 40px; left: 0; background: #ddd url(http://cssmenumaker.com/sites/default/files/menu/96/overlay.png) repeat-x 0 0; border: solid 1px #b4b4b4; -webkit-border-radius: 5px; -moz-border-radius: 5px; border-radius: 5px; -webkit-box-shadow: 0 1px 3px rgba(0,0,0, .3); -moz-box-shadow: 0 1px 3px rgba(0,0,0, .3); box-shadow: 0 1px 3px rgba(0,0,0, .3);}
    #cssmenu2 ul ul li {float: none; margin: 0; padding: 3px; }
    #cssmenu2 ul ul a {font-weight: normal; text-shadow: 0 1px 0 #fff; }
    #cssmenu2 ul:after {content: '.'; display: block; clear: both; visibility: hidden; line-height: 0; height: 0;}
    * html #cssmenu2 ul {height: 1%;}




    Es que aparece error y no puedo poner el submenú
    Ayuda por favor!:(

    ResponderEliminar
    Respuestas
    1. Hola,
      debes ponerlo antes del cierre del /head según se explica en el paso 3. Verifica que pones todo lo que aparece en el citado paso, si se cierra mal una etiqueta o hay cualquier error no te va a dejar guardarlo.

      El código CSS del menú que hayas elegido debe ir ahí, justo antes del head y con las etiquetas que yo pongo en el ejemplo (añadiendo < y >) style type="text/css" antes de todo el código css que tengas y /style al final (recuerda que no puedo poner en el comentario código, debes añadir < y > al final de cada etiqueta).

      Muchas gracias!.

      Eliminar
  7. Hola Miguel! Usas skype? Me gustaría hacerte una consulta.

    ResponderEliminar
    Respuestas
    1. Hola Carla, puedes escribirme aquí o a mi correo directo si es algo privado. Ningún problema. Un saludo y muchas gracias.

      Eliminar
  8. Buena tarde.
    Miguel te cuento que hecho todos los pasos que mencionas e la parte de arriba, y puedo visualizarlo, pero cuando le doy para desplegar y no se visualiza, se esconden.

    gracias

    ResponderEliminar
    Respuestas
    1. Hola Marcela, el problema es que puede que no hayas puesto bien las hojas de estilo o hayas colocado el menú en una zona donde no pueda abrirse.

      Dame la dirección del blog y cuando pueda te lo miro a ver qué sucede.

      Un saludo!

      Eliminar
  9. Hola, he seguido todos los paseos que dejaste indicados, el menú está colocado pero cuando lo pongo debajo de la cabecera, en horizontal, no se despliegan los submenus; sin embargo, cuando lo coloco en un lateral si se despliegan.
    Gracias :)

    ResponderEliminar
  10. Hola Elena,
    eso te sucede porque el contenedor en el que pones el menú no deja que se desplieguen las subopciones. Hay una opción, que sería añadir a la clase del menú que se encarga de los desplegables del submenú la propiedad z-index. En esa clase puedes poner por ejemplo z-index: 843; para que pase por encima del contenedor.

    Un saludo!

    ResponderEliminar
  11. Lo de class="has-sub" en el css donde se mete?
    Yo he copiado el codigo que pusistes y el submenu no me aparece sólo me aparece el menu principal.

    ResponderEliminar
  12. Lo de class="has-sub" en el css donde se mete?
    Yo he copiado el codigo que pusistes y el submenu no me aparece sólo me aparece el menu principal.

    ResponderEliminar
    Respuestas
    1. Hola, mira en el PASO 7). No va en el CSS, va en el propio código del menú, en cada subopción que quieras dibujar. Repasa de nuevo la guía y fíjate especialmente a partir del paso 7.

      Un saludo

      Eliminar
  13. He añadido submenus en mi plantilla pero al desplegarse aparecen detras de la noticia, ¿como se arregla eso con CSS o en la plantilla de blogger?

    ResponderEliminar
    Respuestas
    1. Es la CSS. En la CSS del submenú añade una lìnea que diga "z-index: 843;" o cambia los valores. Eso hará que el submenú quede por delante de cualquier cosa en la que se superponga. Es posible que la CSS no la hayas copiado bien. Recuerda que puedes utilizarla con Google Drive o copiando y pegando el propio código de la CSS, donde estén las CSS de tu web en tu Blog.

      Cualquier cosa aquí estoy.

      Un saludo.

      Eliminar
    2. Hola Miguel, no consigo poner el submenú delante (http://vsvpruebas.blogspot.com.es/)

      ...yle type='text/css'>#cssmenu2 ul {z-index: 850; height: 10em; margin: 0; padd.....
      He puesto el menú mas ancho para que se vea lo que ocurre. ¿Está bien colocado el z-index? Me ocurre lo mismo en diferentes plantillas.

      Eliminar
    3. Ponle un valor negativo para probar, por ejemplo -850, a ver si con ello va mejor. Si no, aplica otro menú más sencillo (como el del ejemplo del tutorial) y cuando lo domines, entonces te lanzas a uno más complejo.

      Un saludo!

      Eliminar
  14. hola, fíjate que yo todo el código lo hago en bloc de notas (solo lo digo para que sepas)
    y pues mi problema es que le puse una galería con sliderman.1.3.8.js, pero cuando el menu se despliega este aparece pero cuando llega a la galería sliderman desaparece lo del sub menu, ose este esta pero queda atrás de la galería, y ya intente de todo lo que yo pude, por eso le pregunto a un experto, por favor ayúdame te lo ruego Miguel

    ResponderEliminar
    Respuestas
    1. Es muy posible que te falte insertar bien la CSS del menú seleccionado en el código de tu web. Puedes poner la CSS accediendo desde Drive o puedes copiar y pegar su contenido directamente en la página de tu web. Tienes esta guía también: http://www.diariosdelanube.com/2013/04/crea-un-menu-con-subopciones-en-blogger.html

      Si te es muy complicado lo de Drive, pon el código CSS del menú en tu head.

      Cualquier duda pregunta lo que necesites.

      Eliminar
    2. miguel fijate que no me funciona esa forma por que ya llevo demaciado adelantado asi que mejor te pregunto de esta manera espero que me puedas comprender, la unica forma de que yo encuentro arreglo a este es en el
      div style que tengo pero ya le puse solid y no funciona aun, ¿abra algun otro div u otra forma de que esta galeria quede detras del menu desplegable que tengo?

      Eliminar
    3. andate a volar mejor y paga clases

      Eliminar
    4. Lo que pienso que te falló es añadir en el HEAD de tu página el css del ejemplo de menú que seleccionaste. Ten paciencia y haz varias pruebas, comienza por un sólo div y después le vas añadiendo todo lo que pone en el ejemplo. Cuando domines el del ejemplo, entonces te metes a hacer otro que tú elijas.

      Un saludo!

      Eliminar
  15. hola diculpa mi menu css lo hice en puremenu.com ya lo puse en mi blog pero al momento de desplegarlo aparece detras de las entradas, como lo puedo solucionar?

    ResponderEliminar
    Respuestas
    1. Hola,
      en la hoja de estilos que has puesto en tu bog de cssmenumaker, es necesario que añadas una línea como esta "z-index: 843;" para las subopciones de menú.

      Un saludo!

      Eliminar

 

© 2015 Por: Miguel García Sánchez - Colomer en Diarios de la nube Todos los derechos reservados.