Cómo crear y personalizar los menús en WordPress

En esta lección del curso, aprenderemos cómo crear y gestionar menús en WordPress. Los menús son elementos cruciales que proporcionan la usabilidad y navegabilidad necesarias a nuestra página web. A continuación, veremos cómo administrarlos.

Creando nuestro primer menú en WordPress

Para crear nuestro primer menú, nos dirigimos a la opción ‘Menús’ que se encuentra bajo la sección ‘Apariencia’ en la barra lateral del panel de administración de WordPress.

Seremos redirigidos a la ventana de gestión de menús. Como es la primera vez y aún no tenemos menús, la única opción disponible es crear un menú:

Desde esta ventana, tendremos la oportunidad de crear nuestro primer menú. Procedamos.

Crear un nuevo menú

Para comenzar, crearemos un nuevo menú; para esto, rellenaremos el campo denominado ‘nombre del menú’ con el nombre elegido y haremos clic en el botón ‘Crear menú’.

Seremos redirigidos a una nueva ventana donde podremos gestionar, editar, eliminar, entre otras cosas, nuestro primer menú.

Desde esta sección, es posible agregar elementos al menú a través del cuadro situado en el lado izquierdo, el cual incluye opciones como páginas, publicaciones, enlaces personalizados, categorías, entre otros. Además, podemos incorporar más elementos si utilizamos algún plugin compatible con los menús de WordPress. En el lado derecho, tenemos la capacidad de organizar la estructura con los elementos que hemos añadido.

Añadir elementos al menú

Agregar un elemento es tan sencillo como seleccionar el elemento y hacer clic en el botón ‘Añadir al menú’.

Te recomendamos leer:  Cómo administrar WordPress - conociendo el panel

Ahora observaremos que se ha añadido un nuevo elemento a nuestro menú inicial.

Haremos lo mismo con las entradas, un enlace personalizado y las categorías, de modo que contemos con elementos en el menú.

Una vez completado, podemos organizar arrastrando y soltando los elementos en el orden deseado. Además, en los ajustes del menú, tenemos la opción de permitir que se añadan nuevas páginas automáticamente o no, así como determinar la posición en la que aparecerá el menú.

Ubicación del menú

Podemos determinar dónde se mostrará el menú; si no lo especificamos, no aparecerá en ninguna parte. Finalmente, podemos guardar el menú utilizando el botón «Guardar menú».

Dependiendo de los temas que utilices, podrás contar con ciertas posiciones o no; sin embargo, es importante mencionar que todos los temas incluyen un menú principal, el cual se ubica usualmente en una barra superior en los sitios web.

Ahora podemos visitar nuestro sitio web y comprobar que, efectivamente, se muestra el menú que acabamos de crear y guardar. Vamos a verlo:

Excelente, ya conoces el proceso para crear menús y estructurarlos. Solo necesitas preparar los elementos que quieras enlazar y agregarlos al menú. Ahora estás listo para incluir tus páginas de ‘Quiénes Somos’, ‘Servicios’, ‘Productos’, y más.

Editar los textos de enlace

Editar los textos de enlace es bastante simple: solo tienes que hacer clic en el elemento que deseas modificar. Puedes hacer clic en el triángulo de despliegue que se encuentra en el extremo derecho de cada elemento.

Se abre una ventana pequeña que nos permite editar el texto del enlace en el campo de la etiqueta de navegación. También podemos ver detalles como: mover de posición, elemento original, eliminar elemento o cancelar la edición.

Te recomendamos leer:  Introducción a wordpress - qué es y para qué sirve

Una vez realizados los cambios necesarios, debemos guardar el menú. Para verificar los cambios, actualizamos nuestro sitio web y deberían verse reflejados.

Perfecto, ahora ya tienes la habilidad para gestionar los menús. Puedes crear todos los menús que requieras y administrar sus posiciones. Además, tienes la opción de gestionarlos con vista previa. Anímate a probarlos, verás que es sencillo e intuitivo.

Para concluir esta lección, aprendamos a crear elementos de submenú, ya que seguramente muchos se lo están preguntando.

Cómo crear submenús en WordPress

Crear un submenú es tan sencillo como arrastrar un elemento debajo de otro y desplazarlo ligeramente hacia la derecha para que se posicione justo debajo del elemento principal.

Por ejemplo, como ejercicio, diseñaremos un elemento personalizado denominado «la empresa», del cual se desglosarán los elementos «quiénes somos» y «nuestros servicios».

Para solucionarlo, primero agregaremos un enlace personalizado al menú. En la URL introduciremos un signo de numeral (#), ya que será un elemento que no llevará a ninguna parte, y en el texto del enlace escribiremos: «La empresa». Para terminar, lo añadiremos al menú.

Después, deberemos arrastrar los elementos «Quiénes somos» y «Nuestros servicios» para colocarlos debajo del elemento «La empresa». Procedamos.

Una vez que se hayan arrastrado los elementos «Quiénes somos» y «Nuestros servicios» a la derecha y debajo del elemento «La empresa», debería verse así:

Si guardamos el menú y actualizamos nuestra página web, observaremos los cambios.

Perfecto, ahora ya tienes el conocimiento para crear submenús en WordPress. Con esta lección, deberías ser capaz de gestionar los menús eficientemente.

Complementos para gestionar menús

Es probable que muchos deseen agregar un toque especial a su menú, otorgándole características o funcionalidades únicas, ya que las opciones son amplias. Para esto, podemos utilizar complementos; hay una gran variedad de plugins diseñados para menús, considerando que son un elemento esencial en casi cualquier sitio web actualmente.

Te recomendamos leer:  Apariencias en WordPress

Por ejemplo, puedes añadir iconos a tus menús, o tal vez incorporar un buscador, o incluso crear un menú condicional.

Una funcionalidad muy apreciada por muchos es el menú fijo, es decir, un menú que permanece visible aunque el usuario se desplace por la página, facilitando así el acceso rápido a diferentes secciones del sitio.

En conclusión, hay muchas posibilidades, pero por ahora esto es suficiente. En futuras publicaciones, exploraremos cómo utilizar un plugin para una tarea específica.

Este videotutorial te puede servir en caso necesites.

4.5/5 - (2 votos)

Deja un comentario

Web Devs