[notice]
Aclaración: esta guía fue creada en base a la versión actual de WordPress a la fecha. (Versión 3.3.2)
[/notice]
Hola Blogguers!
Vamos a comenzar con un nuevo tutorial sobre como crear los famosos menús desplegables de wordpress (de ahora en adelante le llamaremos WP), algo que parece tan simple que por lo general, vemos en las demos de las plantillas que solemos descargar, pero sorpresa! al instalarla, no tiene el menú y es causa decepción para algunos que no saben como es el sistema y recurren a plugins y hasta modificar el código fuente! :negative:
Pues no desesperen!!
Les voy a enseñar la forma simple de como hacerlo con las opciones que el mismo WP traé incorporado.
Se trata de la famosa opción “Menú“, en la cual podemos crear propiamente dicho.. el o los menús para nuestro Blog, el mismo se encuentra en el apartado “Apariencia/Menús”
Una vez dentro de esta opción, no se asusten!!! los voy a guiar paso a paso en todo el camino 😉
Nos dirigimos donde dice “Nombre del menú”
En “Nombre del menú“, escribimos un título para identificar este menú en el caso de querer tener más de uno. Acto seguido, clic en “Crear menú” y pasamos al siguiente paso.
Quiero dejar en claro que al momento de crear algo como esto, es necesario tener una idea de que es lo que queremos que contenga, sino mucho sentido no tiene, a menos que sea informativo o alguna cuestión personal de cada uno, lo dejo al criterio de cada uno.
Ahora tenemos que decidir donde va a ir nuestro menú, esto depende de muchos factores, como lo son el tipo de plantilla que utilizamos, si llevan menú y donde, etc.
Por lo general tenemos 3 ubicaciones que por defecto nos muestra WP, si queremos que se muestre en la parte superior, o sea como menú de cabecera o como menú secundario, o directamente en el pie de nuestra página (menú de pie de página), eso queda a gusto de cada uno, aquí la imagen para que se orienten un poco:
habiendo dejado en claro lo anterior, paso a mostrar los tipos de menús que nos ofrecen WP, nos permiten crear 3 tipos de menú, que detallaré ahora mismo:
1). Enlaces Personalizados.
Esta opción nos permite crear Enlaces en nuestro menú, puede ser lo que quieran y vinculado a donde sea, por ejemplo a mi en lo personal me gusta crear un enlace a la página principal, el cual llamo “Inicio” y lo vinculo a la dirección del blog, “http://www.solucionaeso.com/” y le doy a “Añadir al menú“.
Esto se llenaría de la siguiente manera:
• URL (dirección de la página), mi caso: “http://www.solucionaeso.com/“.
• Etiqueta (El nombre que le queremos poner), mi caso: “Inicio“.
2). Páginas
(Previamente a esto yo eh creado una página a la cual le llamé “Mi Página”, solo a modo de ejemplo)
Si lo que queremos es mostrar en nuestro menú diversas páginas con diversos contenidos, esta es la opción!
Nos presenta 3 pestañas con las páginas “Más reciente“, “Ver todo” y “Buscar“, no requiere mucha ciencia…
En fin, seleccionamos/tildamos la/las páginas que deseamos que se muestren y le amos a “Añadir al menú” y listo.
3). Categorías
(Al igual que el caso anterior, cree una categoría con anticipación para el ejemplo)
Esta opción, nos permitirá mostrar en nuestro menú, las categorías que seleccionemos.
Por defecto está en la pestaña “Más utilizadas” donde nos muestra las que más usamos, yo lo puse en “Ver todo” para que muestre todas, en esta caso solo tengo la que hice “Mi categoria” y “Sin categoría” que viene por defecto, según las que tengamos, se mostrarán ahí.
Bien! ya tenemos todo listo, les muestro comos e vería un ejemplo con todo lo que vimos hasta el momento!
Ahora le damos clic en “Guardar menú” y nos quedaría algo así en nuestra página:
Pero, espera un momento!
Todo muy bonito, muchas imagenes y bla bla bla, pero donde esta mi menú desplegable 😥 !
Tranquilo amigo!
Ahora voy a eso B-)
Ya tenemos lo que buscamos, un menú y ahora lo hacemos desplegable. Para poder lograr lo dicho, tenemos que tener ya sea “Páginas” o “Categorías” Superiores, llámenle madre, padre, tía, abuela, lo que quieran, pero siempre que sean superiores a otras que serian las hijas.
Esta clasificación de “Superior“, la encontraremos al momento de crear o editar tal página o tal categoría en nuestro WP.
Les muestro un par de imágenes de donde se encuentran para cada caso de crear una nueva ya sea página o categoría.
Para el ejemplo vamos a crear nueva página y veremos esta opción en el menú del costado derecho:
Esto significa que estamos creando una nueva página, que será “Hija” de nuestra página anteriormente creada y llamada “Mi Página“, podemos hacer lo mismo con todas las nuevas páginas que vayamos creando y queremos que se muestren en el menú desplegable.
Bueno, ya tenemos nuestras páginas creadas y anidadas en una principal, ahora vamos a trabajar sobre las categorías, al momento de crear una nueva categoría es un menú bastante simple donde no requiere la gran cantidad de datos… tenemos a la vista el la opción de “Superior“, como en la siguiente imagen:
(quiero hacer una aclaración, que le puse a la imagen como título “Categorías”, para no confundirlos, no es que se muestra tal y como lo hice, solo es una pequeña seña para no equivocarnos)
Al igual que en la página, puedo anidar las categorías que quiera a “Mi categoria”
Una vez hecho todo esto, podemos apreciar que no se despliega nada aún!
La solución a todo esto, es ordenar lo que pusimos en “Mi menú“, paso a explicarles… aquí una imagen de como quedaría ya con todo cargado:
Ahora lo que tenemos que hacer, es distribuir, por ejemplo colocar “Página 1” y “Página 2” dentro de “Mi Página“, lo mismo con las categorías, “Categoria A” y “Categoria B“, dentro de “Mi Categoria“, para hacerlo, solo tienes que arrastrarlo el elemento hijo, sobre el elemento superior, por ejemplo, arrastro “Página 1” sobre “Mi Página“, dejo una imagen de como sería:
En fin, nos debería quedar ordenado de la siguiente manera:
Ahora solo es cosa de guardarlo y nos debería funcionar a la perfección.
[gracias][/gracias]
Hola Carlitos !!
Necesitaria conectarme con vos, por favor escribime a mi mail o bien seguime en @polcomunicada
Necesito ayuda urgente sobre el menu desplegable de mi diario hecho en wordpress.
espero atenta tu mensaje !
muchas gracias por tu tiempo y ayuda !
Gisele
Giselle! ya te envíe un correo, cualquier cosa nos comunicamos por ahí.
gracias Carlos!! Muy bueno el tutorial!!
De nada!
Me alegro que te guste! 😉
Carlitox.
Felicitarte por lo claro y ameno de tu tutorial..
Empezare por declararme neófito, entre otros en temas en el de mantenimiento a las paginas.
1. Por lo que espero no verme tan mal preguntándote como ver la versión WordPress y de no estar actualizada como actualizarla a la nueva versión, ya que entiendo por tu nota que es un requisito para poder editar los menús.
2. Veía los comentarios que salen en tu pagina y me dan envidia de la buena ya que en la mía se despliegan en una pagina distinta a la que los origina y no veo como incluirle la respuesta,.
De antemano gracias por la atención que le preste a mi comentario.
Muchas Gracias por tu comentario Jaun!!
En cuanto a lo que mencionaste, voy a tratar de publicar un artículo explicando como actualizar WordPress y saber la versión actual que se tiene.
Con el ítem 2, no entendí muy bien a lo que te referías, tal vez si me explicaras mejor y me mostrases un ejemplo podría tratar de darte una mano!
Saludos!!!
Carlitox:
Disculpa el no haber sido claro en mi segunda nota, intento clarificarla a continuación.
El comentario lo hice para ejemplificar en la pagina”Si no existen síntomas H1N1 y como prevenirlo” cuyo enlace es el siguiente.
http://www.informadormexicano.org.mx/?p=302
Pero aparece en la pagina “Elegir los Presidenciables en México en el 2012″con el enlace
http://www.informadormexicano.org.mx/?p=313
pero ademas no encuentro como darles respuesta, actualmente.
.
Una pregunta adicional. Podrías asesorarme para el cambio de servidor de mi blog y otros detalles, presupuestandome tus honorarios, para ver si quedan dentro de mis posibilidades.
Gracias por tu rápida respuesta
Jaun, creo que sé a que te refieres, si lo que buscas es la opción “Responder” como la que tengo, en teoría si estas usando WordPress te tendría que venir esta opción que se muestra cuando ya existe un comentario al cual se le pueda responder, caso contrario solo saldría el formulario para colocar los datos, eso es lo que interprete.
De igual manera, seguiremos por correo si te parece y te puedo asesorar un poco sobre como mejorar tu blog!
Saludos.-
¡Muchísimas gracias por el tutorial! En la pagina publicada está el resultado.
¡Me alegro que te haya servido!
Quedó genial 😉
Muchas gracias por una explicación tan sencilla y completa, ya estaba por molestar a los programadores para que me hicieran los menús desplegables, siendo algo tan sencillo de hacer gracias a tu tutorial.
Gracias por comentar, me alegro que te haya sigo de utilidad!! y si, cosas tan sencillas que uno puede hacer en un par de minutos y salir del apuro sin joder a nadie 😉
Hola Carlitox,
Estoy empezando a hacer un wordpress y necesito elegir el theme. Los que me irían bien, sin tener que modificar mucho, son estas para portfolio, pero casi ninguna tiene el menú desplegable (son muy sencillas) . Crees que tu tutorial sirve para cualquier plantilla wordpress?
Muchas gracias!
Hola Silvia!
Disculpa la demora en responder, ando con algunos inconvenientes que me impiden prestar la atención debida al sitio. Verás, en teoría es posible hacer lo que quieres (desde mi punto de vista) siempre y cuando la plantilla admita un menú (cosa que casi siempre lo tiene), las que son muy sencillas no suelen tener configurado el estilo para que sea vea bien desplegado, pero si sabes algo de CSS podrás hacerlo tu misma editando dicha plantilla.
Espero que esto cubra tu duda, cualquier cosa no dudes en preguntar y te ayudaré en lo que pueda 🙂
Saludos!!
Hola, muy buen tutorial, muy claro. Solo tengo una duda, ¿cuándo te conviene poner una página y cuándo una categoría en el menú? Muchas gracias por tu ayuda.
Hola Gustavo, creo que eso es una cuestión personal y del diseño.
En lo personal, yo usaría las páginas para informar temas particulares que tengan que ver con la información del blog en general, por ejemplo… tendrías una página para poner información sobre el sitio, otra para poner datos de contacto, etc… y las categorías las usaría para clasificar el contenido de manera más ordenada, si tu blog trata de venta artículos artísticos como pinturas, pinceles y demás… entonces tendría una categoría para los distintos tipos de pinturas, otra para los pinces, etc.. y así el visitante tiene un mejor acceso a las secciones de tu sitio.
Espero que te ayude! lamento la tardanza en responder, Saludos!!
Hola buenas,en primer lugar decir que me ayudo mucho tu informacion.
Ahora tengo una duda…ya tengo el menu desplegable creado y funciona correctamente en todos los navegadores,pero al probarlo en movil o tablet el menu no aparece,y al dar click me carga la pagina cuando deberian salis los desplegables…hay alguna forma de hacer que funcione?
GRACIAS
Hola Juan, me alegro que te haya funcionado, en cuanto al inconveniente con los moviles y demás aparatos táctiles, debes mantener presionado el enlace del menú para que se despliegue, al menos YO no conseguí hacer que funcione de otra manera y por lo que vi en general en todas las páginas con menú desplegable tienes que mantener presionado para que se despliegue.
Es la única solución que puedo darte, espero que te sirva, lamento la demora en responder. Saludos!
Hola Carlitos, me gustaria saber como habilitar en una pagina el lado derecho….creo una nueva pagina y todo lo que contiene el panel lateral no aparece…:( este ultimo fue creado como menu..por fa necesito ayuda urgente. Dafne
Hola Dafne, no comprendí bien tu problema, podrías detallarme un poco mejor? Saludos!
Bien Carlitos, lo detallo mejor…tengo ya un sitio web creado que esta utilizando wordpress para manejar el contenido completo, el detalle es que a la hora de crear yo una nueva pagina solo queda visible el encabezado, un menu superior y el pie de la pagina. mas no aparece el menu del lado derecho que debería. Queria saber a q se debe puesto que soy nueva en esto…y si tienes alguna sugerencia por donde empezar, para solucionar esto, Te agradeceria infinitamente..:)
Ahora creo que comprendo mejor tu problema, lo que interpreto es que al ver una página estática, todo lo que serían los menús, que creo que es el “Sidebar” (la barra lateral donde van los distintos bloques y demás widgets), si es eso, seguramente en la plantilla que estas trabajando debe carece del comando “get_sidebar”,
deberías revisar el archivo “page.php” que se encuentra en el contenido de la plantilla que usas y dentro, ver si no tiene el código, se lo añades.
Suele estar al final de todo y arriba del código que muestra el pie de página (footer), te debería quedar así:
#Toda la programación propia del archivo page.php
.
.
Al final, tendrías que tener algo como esto:
-> (Este muestra la barra del Sidebar)
-> (Este muestra el pie de página)
Prueba y luego me cuentas que tal. Saludos!!
y como manejas los estilos para el menu?
Los estilos se configuran en CSS en el archivo style.css de la correspondiente plantilla que estés utilizando. Saludos!
Fantástico tutorial. Muchas gracias por la información.
Un saludo!
Hola Carlos ! Muy buen tutorial. En el ejemplo de menú “MI PAGINA” con los submenúes “MI PAGINA 1”, “MI PAGINA 2” funciona bien pero tengo el problema que si le hago un click en “MI PAGINA” me muestra de fondo una página vacía con el título MI PAGINA. Lo que necesito es que si hago un click no haga nada y solo pueda elegir las opciones del menú. Muchas Gracias !
Hola Silvio, algo muy utilizado para los enlaces en estos casos es poner en donde va la URL un ” # ” (Sin las comillas) el navegador lo interpreta como si no habría nada. Saludos!
Hola, ante todo las gracias y la enhorabuena por el tutorial. Yo ya tengo creados páginas, subpáginas y categorías, pero al cambiar de plantilla (antes era twenty eleven y ahora la he cambiado por twenty fourteen) pues me ha surgido un problema con el desplegable de las sugpáginas y espero que tenga solución pero por más que miro por ahí no la encuentro. El problema es que solo se ven un máximo de 10 subpáginas y ya tengo más de 20, antes con el otro tema sí se veían todas pero ahora al cambiar de plantilla no consigo que se vean más de las 10 últimas y claro es como si no existieran para los visitantes. ¿Tiene solución? ¿qué debo hacer? si es algo de cambiar códigos en el CSS del style pues no sé mucho la verdad pero dándome unas pautas lo haría ya que yo misma ya modifiqué el tamaño de la foto de cabecera que también me había dado muchos problemas y al final por otro tutorial entré en el editor y modifiqué los códigos y me salió a la primera sin cargarme nada xd… bueno pues eso que a ver si lo puedo modificar para que se vean todas las subpáginas en el desplegable, no solo 10, por otro lado también tengo un plugin de mejoras de este nuevo tema Twenty fourteen pero no parece que venga ahí la solución, aunque viene en inglés y tampoco me aclaro mucho. Muchas gracias de antemano y felicitaciones por la página, saludos
Creería que tiene que ver con alguna función php, habría que investigarlo un poco.
Estimado, he seguido los pasos tal cual lo indicas.. pero no logre el menú desplegable, que otra cosa podría estar mal?
En todo caso puede ser la plantilla que estés utilizando que no tenga esa función, habría que verificar en el archivo header.php de la plantilla en cuestión y revisar si tiene la siguiente función: wp_nav_menu.
Si no la tiene hay que agregarla para poder ver el menú. Saludos!
hola, tengo una consulta, en mi pagina de wordpress no me aparece el item menu, como puedo instalarlo para crear una lista desplegable
gracias!