驴C贸mo crear un men煤 en WordPress?

Los聽men煤s en WordPress, a mi parecer, creo que son los elementos m谩s importantes que componen un sitio web. Sin los men煤s no podr铆amos navegar ni conocer todos los apartados como p谩ginas, entradas o productos de un sitio web.

Crear un聽men煤 en WordPress聽es muy sencillo. Es necesario tener en cuenta como configurarlo y distribuirlo de manera que la navegaci贸n sea agradable y el usuario pueda acceder a todos los contenidos de nuestro sitio web.

脥ndice del contenido
    Add a header to begin generating the table of contents

    1. Conociendo los men煤s en WordPress

    Dir铆gete al apartado聽Apariencia >> Men煤s. Desde este apartado es donde se gestionan todos los men煤s que compondr谩n tu sitio web en WordPress.

    En la siguiente imagen podr谩s observar todos los par谩metros y elementos con los que podr谩s construir y configurar un聽men煤 en WordPress.

    Elementos y propiedades de un men煤 en WordPress
    Elementos y propiedades de un men煤 en WordPress
    • A帽adir p谩ginas autom谩ticamente. Marcando esta opci贸n, cada vez que crees una p谩gina nueva, esta se a帽adir谩 al men煤 sin tener que hacer nada. Se recomienda dejar esta casilla desmarcada para no romper la est茅tica del sitio web. Luego podr谩s a帽adir la p谩gina al men煤 en el orden que quieras,
    • D贸nde se ver谩. Aqu铆 podr谩s elegir qu茅 men煤 quieres crear. Estos men煤s est谩n disponibles seg煤n el tema que est茅s utilizando.

    Haciendo clic en la pesta帽a Opciones de pantalla, puedes habilitar otros tipos de contenido y las propiedades avanzadas del men煤.

    • Destino del enlace. Este par谩metro se utiliza si quieres que la p谩gina se abra en una ventana nueva del navegador. Muy 煤til para los Enlaces personalizados.
    • Atributos del t铆tulo. Este texto ofrece informaci贸n adicional del enlace. Por ejemplo, hacia d贸nde te llevar谩 el enlace.
    • Clases CSS. Puedes a帽adir una clase y luego crear la regla CSS. Por ejemplo, si quieres que el color de ese elemento sea rojo en vez de verde para que resalte del resto de elementos en el men煤.
    • Relaci贸n con el enlace (XFN). Esta propiedad permite establecer la relaci贸n que tiene el enlace con el exterior. Por ejemplo si quieres que sea un enlace nofollow (rel="nofollow").
    • Descripci贸n. Permite a帽adir una descripci贸n al enlace ofreciendo una informaci贸n amplia sobre el destino del enlace.

    De todos estos par谩metros el que m谩s se utiliza es聽Destino del enlace siempre que sea necesario. Se recomienda su uso con Enlaces externos si quieres enlazar con otro sitio web o landing pages en el mismo sitio web.

    Propiedades avanzadas de un elemento de men煤
    Propiedades avanzadas de un elemento de men煤

    El texto que indiques en el campo Etiqueta de navegaci贸n聽ser谩 el que se muestre en el men煤.

    Aunque cada elemento est谩 relacionado con una p谩gina (o taxonom铆a), es recomendable聽indicar un nombre corto聽que est茅 relacionado con el contenido de la p谩gina. De esta manera no se rompe la est茅tica del sitio web.

    Anuncio publicitario

    2. Creando el men煤 de mi sitio web

    En WordPress, los temas se desarrollan para聽soportar 1 o m谩s men煤s聽dependiendo del desarrollador.

    Como te he mencionado anteriormente,聽Astra聽es el tema que estamos utilizando para el desarrollo de este聽curso de WordPress. Este tema聽soporta 2 men煤s: el men煤 primario (o men煤 principal) y el men煤 del pi茅 de p谩gina.

    En la lecci贸n,聽crear una p谩gina con WordPress, te he sugerido聽trabajar con una estructura inicial聽(Excel) para llevar el orden de las p谩ginas que vayas creando en tu sitio web.

    La finalidad de trabajar con una estructura inicial es que, tanto en el Excel, como en el listado de p谩ginas y el men煤,聽coincida el orden de las p谩ginas聽creadas.

    Puedes descargar el fichero Excell desde el enlace:聽estructura inicial.

    Excel con la estructura inicial de un proyecto en WordPress
    Excel con la estructura inicial de un proyecto en WordPress

    Para crear un men煤:

    1. Dir铆gete al apartado聽Apariencia >> Men煤s聽y escribe un nombre en el campo聽Nombre del men煤. Por ejemplo:聽Men煤 principal.
    2. En聽P谩ginas, selecciona todos los elementos que van a componer el men煤.
    3. Haz clic en el bot贸n聽A帽adir al men煤.

    Como puedes observar, todos los elementos seleccionados se han a帽adido al apartado聽Estructura del men煤.

    Para cambiar el orden de los elementos del men煤, haz clic en cada uno y, sin soltar el rat贸n, arr谩stralos hacia arriba o abajo聽hasta que se encuentren todos en el orden que desees.

    Para cambiar el nombre de los elementos de men煤, despliega cada uno de los elementos del men煤聽(haciendo clic en la flecha) y, en el campo聽Etiqueta de navegaci贸n, escribe el nombre que se visualizar谩 en el men煤.

    Marca la casilla Men煤 primario en los ajustes del men煤 y haz clic en Guardar men煤.

    Creaci贸n del men煤 principal del sitio web
    Creaci贸n del men煤 principal del sitio web

    Una vez hayas creado el men煤 principal hay que聽crear el men煤 del pi茅 de p谩gina. Para esto, haz clic en el enlace聽crea un nuevo men煤聽y repite el procedimiento anterior.

    Puedes聽a帽adir los elementos de men煤聽que consideres oportunos. Lo m谩s com煤n es a帽adir las p谩ginas legales y alguno m谩s si deseas.

    Creaci贸n del men煤 del pi茅 de p谩gina del sitio web
    Creaci贸n del men煤 del pi茅 de p谩gina del sitio web

    Vamos a la聽portada de nuestro sitio web聽para comprobar que se ven bien los men煤s que hemos creado. Abre una nueva pesta帽a del navegador y escribe la URL de tu sitio web:聽https://www.midominio.com/聽(recuerda sustituir midominio.com por el tuyo).

    Con el tema Astra, podemos observar que el men煤 principal se encuentra en la cabecera de la p谩gina pero no se encuentra el men煤 del pi茅 de p谩gina. Entonces, 驴qu茅 hemos hecho mal?

    No te preocupes que no hemos hecho nada mal. Aunque Astra ofrece un espacio en el pi茅 de p谩gina para alojar el men煤, tambi茅n聽ofrece espacio para otros elementos. Es por esto que no lo ha asignado autom谩ticamente y hay que hacerlo de forma manual.

    Para esto, dir铆gete a聽Apariencia >> Personalizar >> Pie de p谩gina >> Barra del pie de p谩gina.

    Asignar el men煤 pi茅 de p谩gina en Astra
    Asignar el men煤 pi茅 de p谩gina en Astra

    En聽Dise帽o, puedes elegir la configuraci贸n de los elementos del pi茅 de p谩gina.聽>En las聽Secciones 1 y 2, selecciona el contenido que quieres que se muestre en estos espacios. Puedes elegir entre men煤 del pie de p谩gina, texto personalizado, un widget o nada.

    Una vez hayas finalizado, haz clic en聽Publicar.

    3. Submenus en WordPress

    Los submen煤s son聽elementos dependientes聽de los elementos de un men煤. Son aquellos que se despliegan debajo de un elemento de men煤 cuando pasas el rat贸n.聽A un elemento de men煤 se suele llamar聽padre聽y al de un submen煤聽hijo.

    Crear un submen煤 es exactamente igual que聽crear un men煤 en WordPress聽con algunas variaciones.

    El proceso es el siguiente:

    1. Lo primero que tienes que hacer es crear un men煤.
    2. Selecciona los elementos y聽a帽谩delos a la estructura del men煤. Se a帽adir谩n al final de todos los elementos.
    3. Selecciona uno de ellos y arr谩stralo justo debajo del聽elemento padre del men煤聽que corresponda. Una vez lo ubiques debajo de este elemento, arr谩stralo ligeramente hacia la derecha.
    4. Repite el mismo procedimiento con el resto de elementos.
    5. Haz clic en el bot贸n聽Guardar men煤.

    El orden en el que coloques los elementos, tanto del men煤 como del submen煤,聽ser谩 el mismo orden que se vera en tu sitio web.

    Creaci贸n de un submen煤 en WordPress
    Creaci贸n de un submen煤 en WordPress
    Submen煤 en WordPress
    Submen煤 en WordPress

    4. Elementos de men煤 sin enlace

    Los elementos de men煤 sin enlace se suelen utilizar mayormente cuando tenemos un submen煤 (o varios) en nuestro men煤 principal. La idea es tener un elemento padre que no enlace con nada y que de 茅l dependan varios elementos hijo que conforman el submen煤.

    Un elemento de men煤 sin enlace es un elemento decorativo de primer nivel, que no tiene ninguna relaci贸n con los tipos de contenido, pero que es necesario para alojar elementos hijo y construir un submen煤.

    Tomando como referencia las im谩genes del punto anterior, f铆jate que tanto el elemento padre (Servicios) como los elementos hijo son p谩ginas. Esto quiere decir que el elemento padre enlaza con una p谩gina y, de esa p谩gina, derivan 3 subp谩ginas relacionadas.

    Ahora veamos las siguientes im谩genes:

    Creaci贸n de un submen煤 con elemento sin enlace en WordPress
    Creaci贸n de un submen煤 con elemento sin enlace en WordPress
    Submen煤 en WordPress
    Submen煤 en WordPress

    En este caso el elemento padre (Servicios) no es una p谩gina sino un Enlace personalizado (primera imagen) al que no le hemos asignado ning煤n enlace. Ser谩 un elemento decorativo sin enlace pero necesario para crear el submen煤.

    Sin embargo, en el men煤 de nuestro sitio web (segunda imagen), no ha cambiado nada desde el punto de vista est茅tico pero el elemento padre no nos redirigir谩 a ning煤n sitio por no tener enlace.

    Para crear un enlace sin men煤 tenemos que a帽adir un elemento del tipo Enlace personalizado:

    • URL: simplemente escribimos el s铆mbolo almohadilla "#".
    • Texto del enlace: escribimos el texto que queremos que se vea en el men煤.
    Enlace personalizado en un men煤 en WordPress
    Enlace personalizado en un men煤 en WordPress

    Anuncio publicitario

    5. Conclusi贸n

    Crear un men煤 en WordPress聽es bastante sencillo. Dependiendo del tema que utilices, puedes realizar un sitio web con varios men煤s seg煤n tus necesidades.

    Como te he mencionado anteriormente, los men煤s聽son los elementos m谩s importantes聽de un sitio web. Sin un men煤, no podr铆amos navegar ni conocer un sitio web.

    驴Te ha gustado?

    Te estar铆a muy agradecido si pudieras valorar esta entrada y compartirla en tus redes sociales. De esta manera me animas a continuar trabajando en este proyecto y ayudas a otras personas que desean aprender.

    (13 votos, promedio: 5 de 5)

    Facebook
    Twitter
    WhatsApp
    Telegram
    Email

    驴Me invitas un caf茅?

    Todo el contenido que puedes encontrar en este sitio web es gratis y siempre lo ser谩 pero, mantenerlo, requiere de muchos caf茅s y muuuuchas horas . Si te gusta mi trabajo y te est谩 ayudando, considera invitarme un caf茅 para apoyarme y apoyar este proyecto. 隆Te invito un caf茅!.

    Suscr铆bete y aprende WordPress desde cero

    No me gusta el SPAM y se que a ti tampoco. S贸lo recibir谩s informaci贸n 煤til sobre WordPress.

    Al enviar, confirmas que has le铆do y aceptas la pol铆tica de privacidad. Conoce nuestro compromiso con tu privacidad.

    Comparte tu experiencia

    Deja un comentario si tienes alguna duda o cu茅ntanos c贸mo ha sido tu experiencia.

    guest
    7 Comentarios
    Inline Feedbacks
    Ver todos los comentarios
    Noelia

    Hola Gian,
    Gracias por esta publicaci贸n.
    Tengo una duda, he creado un men煤 primario, un s贸lo elemento que es un enlace externo.
    Cuando pasa a responsive, se transforma en men煤 hamburguesa, cosa que me va perfecto, pero al desplegarse el men煤, me aparece en color lila Astra... c贸mo puedo modificar ese color al turquesa en que est谩 dise帽ada mi web?

    Muchas gracias de antemano y saludos,
    Noelia

    Gian Oliveira

    Hola Noelia, la mayor铆a de colores y tipograf铆as en general de Astra solo se pueden modificar con la versi贸n PRO. En este enlace puedes comprar la versi贸n PRO: Astra PRO. Un saludo!

    Noelia

    Muchas gracias por responder tan r谩pido!

    Facundo

    Hola Gian una pregunta, yo en mi menu tengo un elemento que es etiqueta, y debajo aparecen otras etiquetas que deber铆an ser subcategorias, pero tengo problemas y no se como solucionarlo, si me puedo comunicar con vos de alguna forma te estaria super agradecido

    Gian Oliveira

    Hola Facundo, con este comentario ya te has comunicado conmigo, solo que no entiendo muy bien que problema tienes. Si quieres puedes exponerlo respondiendo a este comentario y as铆 lo compartimos con el resto de usuarios. Un saludo!

    Facundo

    Okey Gian gracias por el servicio. El problema es el siguiente, como p谩gina de entradas seleccione la de Blog, pero tengo otra pagina que es la de cultivo que tambi茅n van entradas espec铆ficas al a eso, al cultivo, el problema es que cuando clickeo en el men煤 la parte de cultivo, cuando carga no aparece ninguna de las entradas, entonces decid铆 poner una Etiqueta que en esta si aparecen. No se si hay alguna manera, en el caso de que ponga la pagina de cultivo en el menu, de que no tenga ninguna acci贸n es decir que clicken y no pase nada. Tampoco me deja colocar categor铆as en el men煤 no se si es normal de wordpress o si es problema mio. Espero haberme explicado, saludos!

    Gian Oliveira

    Hola Facundo, si he entendido bien creo que el problema est谩 en que has creado una p谩gina que se llama Cultivo y quieres que aparezcan las entradas correspondientes. En primer lugar, Cultivo deber铆a ser una Categor铆a, no una p谩gina. No es "t茅cnicamente correcto" poner entradas de una categor铆a en una p谩gina a menos que sepas lo que est谩s haciendo. Lo que tienes que hacer es crear una categor铆a llamada Cultivo y asignarle esa categor铆a a las entradas correspondientes (borra la p谩gina). Luego asignas la categor铆a como item del men煤. Para que WordPress te deje hacerlo, tiene que haber al menos 1 entrada con esa categor铆a asignada. En el cap铆tulo 07 puedes encontrar toda la informaci贸n sobre la gesti贸n de un blog. Un saludo!

    7
    0
    驴Dejas un comentario? Gracias!x
    ()
    x
    Search
    Generic filters

    Tratamiento de datos personales

    • Responsable: MARIA ANTONIETA BEAUTY CONCEPT, S.L.
    • Finalidad: Suscribirte a la lista de correos electr贸nicos.
    • Derechos: Podr谩s ejercer tus derechos de acceso, rectificaci贸n, limitaci贸n y suprimir los datos en legal@cursowordpress.com, as铆 como el derecho a presentar una reclamaci贸n ante una autoridad de control.
    • Destinatarios: Los datos no se ceder谩n a terceros salvo en los casos en que exista una obligaci贸n legal.
    • Informaci贸n adicional: En mi聽pol铆tica de privacidad encontrar谩s informaci贸n adicional sobre la recopilaci贸n y el uso de su informaci贸n personal incluida informaci贸n sobre acceso, conservaci贸n, rectificaci贸n, eliminaci贸n, seguridad y otros temas.

    Tratamiento de datos personales

    • Responsable: MARIA ANTONIETA BEAUTY CONCEPT, S.L.
    • Finalidad: Moderar y responder comentarios de usuarios.
    • Derechos: Podr谩s ejercer tus derechos de acceso, rectificaci贸n, limitaci贸n y suprimir los datos en legal@cursowordpress.com, as铆 como el derecho a presentar una reclamaci贸n ante una autoridad de control.
    • Destinatarios: Los datos no se ceder谩n a terceros salvo en los casos en que exista una obligaci贸n legal.
    • Informaci贸n adicional: En mi聽pol铆tica de privacidad encontrar谩s informaci贸n adicional sobre la recopilaci贸n y el uso de su informaci贸n personal incluida informaci贸n sobre acceso, conservaci贸n, rectificaci贸n, eliminaci贸n, seguridad y otros temas.