Cómo gestionar menús de navegación

Los menús de navegación son una parte fundamental de cualquier página web, ya que permiten a los visitantes acceder fácilmente a las distintas secciones de tu sitio.

Acceder al gestor de menús

Para administrar los menús de tu web, accede al panel de administración de WordPress y dirígete a:

Apariencia → Menús

Si no ves este acceso, escribe a soporte@pom.es para pedir permisos.

Añadir elementos al menú

Desde la columna izquierda podrás añadir diferentes tipos de contenido:

Si echas en falta algún elemento, lo puedes activar desde aquí:

Páginas

Añade páginas ya existentes de tu web.

1. Marca las páginas que quieras incluir.
2. Haz clic en Añadir al menú.

Entradas del blog

Puedes añadir artículos individuales.

1. Selecciona las entradas deseadas.
2. Haz clic en Añadir al menú.

Categorías

Permiten enlazar directamente a una categoría del blog.

1. Selecciona la categoría.
2. Haz clic en Añadir al menú.

Enlaces personalizados

Sirven para añadir enlaces externos o internos.

1. Introduce la URL.
2. Escribe el texto que se mostrará en el menú.
3. Haz clic en Añadir al menú.

Reordenar elementos

Una vez añadidos, puedes cambiar el orden fácilmente:

1. Haz clic sobre un elemento del menú.
2. Arrástralo hasta la posición deseada.
3. Los cambios se guardarán cuando pulses Guardar menú.

Crear submenús o desplegables

Los submenús permiten organizar mejor la navegación.

1. Arrastra el elemento que quieras convertir en submenú.
2. Desplázalo ligeramente hacia la derecha debajo del elemento principal.
3. WordPress mostrará automáticamente la estructura jerárquica.

Ejemplo:

• Servicios
  • Diseño Web
  • Tiendas Online
  • SEO

Cambiar el texto de un elemento

Si deseas mostrar un nombre diferente al título original de una página:

1. Haz clic sobre el elemento dentro del menú.
2. Modifica el campo Etiqueta de navegación.
3. Guarda los cambios.

Eliminar un elemento del menú

1. Haz clic sobre el elemento que quieras eliminar.
2. Pulsa Eliminar.
3. Guarda el menú.

Guardar los cambios

Cada vez que realices modificaciones en el menú, recuerda pulsar Guardar menú para que los cambios se reflejen en la web.

Añadir menús mediante módulos del maquetador

Además de asignar un menú a las ubicaciones predeterminadas de WordPress, también es posible mostrarlo en cualquier parte de la página utilizando los módulos del maquetador.

Para ello, simplemente añade un módulo de Menú en la zona donde quieras mostrarlo y selecciona el menú que deseas utilizar. Esto te permite crear navegaciones personalizadas en cabeceras, barras laterales, páginas de aterrizaje o pies de página sin depender de la estructura principal de la web.

 

Opciones avanzadas de los elementos de menú

Cuando editas un elemento dentro de Apariencia > Menús, además del enlace y el nombre visible, dispones de varias opciones avanzadas para personalizar su comportamiento y apariencia.

Etiqueta de navegación

Es el texto que verá el usuario en el menú.

Ejemplo:

Condiciones de uso y privacidad

Este texto puede ser diferente al título real de la página.

Atributo de título

Permite añadir un texto descriptivo adicional al enlace.

Antiguamente se mostraba como un tooltip al pasar el ratón por encima, aunque actualmente muchos navegadores ya no lo utilizan de forma visible.

Ejemplo:

Consulta nuestras condiciones legales y política de privacidad.

Abrir enlace en una pestaña nueva

Si activas esta opción, el enlace se abrirá en una nueva pestaña del navegador.

Es recomendable para:

• Enlaces externos.
• Redes sociales.
• Documentos PDF.

No suele ser necesario para páginas internas de la web.

Clases CSS (opcional)

Permite añadir clases CSS personalizadas al elemento del menú.

Sirve para aplicar estilos específicos mediante código.

Ejemplos:

• menu-destacado
• menu-verde
• menu-icono

Solo es recomendable utilizarlo cuando se vayan a aplicar estilos personalizados.

Relación con el enlace (XFN)

XFN (XHTML Friends Network) es un sistema antiguo para indicar la relación entre el propietario de la web y el enlace.

Actualmente apenas se utiliza.

Ejemplos:

• nofollow
• friend
• external

En la mayoría de los casos puede dejarse vacío.

Descripción

Permite añadir un texto descriptivo adicional al elemento del menú.

Algunos temas muestran esta descripción debajo del enlace principal.

Ejemplo:

Servicios

Diseño web, branding y marketing digital.

Si el tema no soporta esta función, la descripción no será visible.

Display in languages

Permite indicar en qué idioma debe mostrarse el elemento del menú.

Opciones disponibles:

• Español
• EU (Euskera)
• EN (Inglés)

Si no seleccionas ningún idioma, el elemento aparecerá en todos los idiomas disponibles.

Es especialmente útil en webs multilingües.

Atributos de datos

Campo destinado a añadir atributos personalizados al elemento.

Se utiliza normalmente para funcionalidades avanzadas desarrolladas a medida mediante JavaScript.

Importante:

Los valores deben escribirse utilizando comillas simples y no comillas dobles.

Ocultar etiqueta (solo icono)

Oculta el texto del menú y muestra únicamente el icono asociado.

Ideal para:

• Redes sociales.
• Iconos de búsqueda.
• Iconos de usuario o carrito.

Mega Menú

Convierte el elemento en un contenedor de tipo Mega Menú.

Esto permite desplegar grandes bloques de contenido organizados en columnas, imágenes y enlaces.

Muy útil para:

• Tiendas online.
• Webs corporativas con muchas secciones.
• Portales de servicios.

Etiquetas de columnas

Permite que el elemento funcione como encabezado de una columna dentro de un Mega Menú.

Ayuda a organizar visualmente los enlaces agrupados.

Etiquetas con enlace

Determina si la etiqueta de una columna es clicable o funciona únicamente como título visual.

Activado

El usuario puede hacer clic sobre el título.

Desactivado

El título sirve únicamente como encabezado.

Imagen de fondo del mega menú

Permite seleccionar una imagen de fondo para el Mega Menú.

Puede utilizarse para:

• Mostrar fotografías corporativas.
• Destacar promociones.
• Mejorar la estética del desplegable.

Enlace de diseño del botón

Convierte el elemento de menú en un botón visual destacado.

Ideal para llamadas a la acción como:

• Contactar.
• Reservar cita.
• Solicitar presupuesto.
• Comprar ahora.

Estilo del botón

Permite elegir la apariencia del botón.

Por ejemplo:

• Botón 1 – Fondo azul.
• Botón 2 – Fondo oscuro.
• Botón transparente.
• Botón con borde.

Los estilos disponibles dependerán de la configuración del tema.

Select icon

Permite añadir un icono al elemento del menú.

Algunos ejemplos:

• Teléfono.
• Email.
• Usuario.
• Carrito.
• Flecha.

Los iconos ayudan a mejorar la identificación visual de cada enlace.

Selecciona la posición del icono

Define dónde aparecerá el icono respecto al texto.

Opciones habituales:

• Antes de la etiqueta.
• Después de la etiqueta.
• Solo icono.

Ejemplo:

📞 Contacto

o

Contacto 📞

Mover

Permite cambiar la posición del elemento dentro del menú sin necesidad de arrastrarlo.

Opciones:

• Mover arriba.
• Mover abajo.