Cómo crear y editar la navegación del menú en WordPress

Publicado: 2020-09-24

El menú de navegación es uno de los elementos más importantes de su sitio web. Sin él, sus visitantes no podrán acceder al contenido que necesitan, no entenderán qué contenido ofrece y, por lo general, existirán en un estado de confusión con respecto a su sitio. Desafortunadamente, el sistema de menús de WordPress no es la parte más intuitiva del CMS (sistema de gestión de contenido). Entendemos eso y queremos mostrarle cómo navegar mejor por el sistema de navegación WP. Para que usted y sus usuarios tengan la mejor experiencia posible.

Antes de crear un menú de WordPress

Ahora, antes incluso de profundizar en la estructura del menú de WP, tomemos un segundo para planificar esto. Si bien crear un menú es simple (solo vaya a Apariencia - Menús y comience a hacer clic), crear un menú útil es un poco más profundo. Esencialmente, hágase dos preguntas:

  • ¿Para quién estoy haciendo un menú?
  • ¿A dónde quiero que vayan mis visitantes?

¿Para quién estoy haciendo un menú? , puede parecer una tontería. Porque la respuesta es, sin duda, "sus usuarios". Pero no es tan sencillo. Los diferentes usuarios necesitan cosas diferentes. ¿Los nuevos usuarios necesitarán las mismas páginas que los que regresan? ¿Los miembros que han iniciado sesión ven los mismos menús que los que no han iniciado sesión?

Si piensa en las personas que utilizarán este menú específico, podrá simplificarlo. Puede evitar llenarlo de páginas que abrumarán a las personas que lo miran. Lo mejor de los menús de WordPress es que puede crear muchas versiones y mostrarlas en diferentes lugares.

Lo que nos lleva a la pregunta número dos: ¿ adónde quiero que vayan mis visitantes? De la mano de qué usuarios necesitan qué menús, decidir dónde desea que vayan esos usuarios determinará qué tipo de menús cree.

ElegantThemes.com como ejemplo del mundo real

Por ejemplo, hicimos un rediseño del menú de encabezado aquí en Elegant Themes hace un tiempo. Queríamos centrarnos en dirigir el tráfico a nuestro grupo de Facebook, los usuarios de Divi Theme y nuestra red Meetup. Además de Divi en sí, pero eso es evidente. Para hacer esto, simplificamos la estructura del menú para darle al usuario solo un puñado de opciones, en comparación con la versión más robusta que solía existir.

menú divi wordpress Desplácese sobre Divi y verá enlaces no solo a las características del tema, sino también a nuestras redes sociales que queríamos resaltar. Todos los productos también mostrarán a Divi como un producto insignia, y también lo harán los precios cuando la gente vea nuestras opciones de membresía. La cuenta se encuentra fuera de ese paradigma de nuevos usuarios, pero les brinda a los nuevos usuarios acceso rápido a sus membresías, así como también brinda la opción de registrarse como nuevos miembros. El contacto también está disponible para todos.

Como puede ver, todos y cada uno de los elementos del menú dirigen a un segmento elegido de visitantes a las páginas que queremos que vean más. Dicho esto, también tenemos un menú más completo en el pie de página de la página que enlaza con lugares como nuestro blog, recursos, páginas de productos individuales, etc.

et menú de pie de página

Los menús de encabezado también están allí. Pero sabemos que el menú en la parte inferior de la página lo van a utilizar personas con una necesidad más específica, que saben buscar otro menú (como es el estándar web en estos días) para encontrar lo que buscan.

Con eso en mente, es probable que haya descubierto para quién está creando el menú y qué quiere que hagan. Así que vamos a construir su menú de WordPress.

Cómo crear menús de WordPress

Dirígete a Apariencia - Menús en tu panel de WordPress. Debería ver algo como esto:

editar página

Esta página no es la parte más fácil de usar de WordPress, pero verá algunas partes que se relacionan con lo que discutimos anteriormente.

El nombre del menú es para su referencia. Ningún usuario verá esto. Lleve un registro de qué menú va a cada lugar nombrándolo apropiadamente. A la izquierda, verá Páginas, Publicaciones, Enlaces personalizados y Categorías . Algunos temas incluyen más opciones aquí. El tuyo puede o no. Los elementos del menú pueden ser publicaciones o páginas individuales, así como enlaces de categorías. Además, los enlaces personalizados le permiten enlazar a cualquier cosa, solo recuerde https: // o sus enlaces pueden terminar muertos.

En Configuración del menú , le recomendamos encarecidamente que mantenga la opción Agregar páginas automáticamente deshabilitada. Esta opción agrega todas las páginas nuevas creadas en su sitio al menú de WordPress. La mayoría de la gente nunca marcará esta casilla.

Ahora, las opciones de Ubicación de visualización variarán de un tema a otro porque cada tema tiene un diseño diferente en términos de dónde permiten que se muestren los menús de WordPress. Sin embargo, estos son los lugares dentro de su sitio donde su menú puede aparecer completo. No puede obtener más ajustes precisos para las ubicaciones del menú en la pestaña Administrar ubicaciones en la parte superior de la pantalla.

ubicaciones de los menús de wp

A continuación, agregue cualquier contenido que desee en el menú. Simplemente marque la casilla junto a él y haga clic en Agregar al menú . Al hacerlo, se agrega en Estructura del menú . Haga clic en la flecha para mostrar otras opciones como Etiqueta de navegación .

poner un elemento en la navegación

Tenga en cuenta que la etiqueta de navegación mostrará a los usuarios. Esta es la parte que aparece en el menú. Entonces, si el título de una página es demasiado largo, puede acortarlo aquí.

Ahora, la parte más importante de la creación de menús de WordPress (y quizás una de las acciones más olvidadas en toda la plataforma) es hacer clic en Guardar menú a la derecha de la pantalla.

guarda tus menús de wordpress si valoras el tiempo que dedicaste a crearlos

Una vez guardado, el menú se activará. Si ya se muestra en su sitio, los cambios serán inmediatos.

Cómo crear un menú desplegable de WordPress

En su mayor parte, los pasos anteriores también son los mismos para crear un menú desplegable en WordPress. Sin embargo, hay otro paso que debe seguir para que aparezcan los submenús.

En la sección Estructura del menú , cada uno de los elementos se puede arrastrar. Para crear un menú desplegable, simplemente haga clic en el elemento que desee y arrástrelo al elemento que desee como principal . WordPress es lo suficientemente inteligente como para saber que si le traes un elemento a otro, quieres seguirlo. Anidarlos creará un menú desplegable en la interfaz.

Creación de una estructura de menú personalizada de WordPress

Repita esto para todos los elementos que desee en el menú desplegable. La jerarquía anidada es fácil de entender. Cada vez que se crea un nuevo nivel en la estructura, tendrá un menú desplegable adicional.

Creación de una estructura de menú personalizada de WordPress

En el front-end, se verá similar a esto:

opciones desplegables en wordpress

Ahora, estos pasos asumen que estás usando elementos de menú que existen. Sin embargo, si no desea que el elemento que activa el menú desplegable sea un vínculo navegable, simplemente puede crear un vínculo personalizado que tenga un # en lugar de una URL.

URL de marcador de posición con un hashtag

Al hacerlo, se creará un elemento de menú, pero hacer clic en él no hará más que expandir el menú desplegable.

Cómo utilizar varios menús en su sitio de WordPress

Volviendo a lo que discutimos anteriormente, queremos asegurarnos de que cada menú que mostramos esté enfocado. A veces, los megamenús son la mejor opción para la navegación del sitio. Por ejemplo, Amazon es un gran ejemplo de un sitio que hace un gran uso de un mega menú. Sin embargo, la mayoría de los sitios que usan megamenús no los necesitan. Complican innecesariamente la navegación del sitio.

Sin embargo, si tiene un sitio grande y puede compartimentarlo, usar varios menús en su sitio casi siempre será la mejor opción. Cuantas menos elecciones tenga que hacer un usuario, es más probable que haga la elección que usted desea.

Ahora, como ejemplo, digamos que desea crear un menú que solo aparezca en las barras laterales del blog para ayudar a los usuarios a orientarlos. Podríamos nombrar el menú con algo como S idebar Widget para realizar un seguimiento. Pero si observa la pestaña Mostrar ubicación o Administrar ubicaciones , es posible que no haya una opción de barra lateral.

Creación de una estructura de menú personalizada de WordPress

Eso solo significa que tendremos que colocar manualmente el menú. En el panel de WordPress, diríjase a Apariencia - Widgets y busque el widget Menú de navegación .

menús de la barra lateral

En su mayor parte, su tema tendrá una opción de barra lateral genérica. El widget del menú de navegación está predeterminado en WordPress. Entonces esto funcionará independientemente de su tema. Sin embargo, su tema puede tener algo más para los widgets de menú, y los pasos básicos aún deberían aplicarse.

Al igual que los elementos del menú desplegable, haga clic y arrástrelo al área de la barra lateral . Debido a cómo funcionan los widgets en WordPress, el widget aparecerá inmediatamente en su sitio. Sin embargo, no ha elegido un menú para mostrar, por lo que será un espacio en blanco.

menú de la barra lateral del widget

Si elige un título , aparecerá como un título encima del menú. La opción Seleccionar menú es donde elige el menú específico que desea que se muestre. También puede hacer clic en el enlace Visibilidad y abrir el cuadro adicional que ve arriba. Este nuevo cuadro le ofrece opciones para la visibilidad condicional. Para esto, es posible que solo queramos que este menú aparezca en publicaciones categorizadas como Podcasts , por lo que cuando hacemos clic en Guardar , los cambios se implementan.

menú del creador de temas de la barra lateral divi

Eso es todo lo que tienen que hacer. Debe tener en cuenta que todo lo que haya creado como un menú desplegable para los menús de encabezado aparecerá como un menú anidado en el widget de la barra lateral. Entonces, si creó alguna URL de marcador de posición usando #, ese será un enlace en este menú en el que no se puede hacer clic. Simplemente planifique la creación de su menú de WordPress en consecuencia.

Terminando con el menú de WordPress

El sistema de menús de WordPress no tiene por qué ser intimidante. A veces puede parecer un poco confuso, pero como puede ver, es un proceso fácilmente navegable que puede ser bastante poderoso una vez que sepa cómo hacerlo. Sin embargo, recuerde que, a medida que continúe creando su propia navegación del sitio, los menús no son iguales para todos. Asegúrese de tener en cuenta quién desea encontrar qué páginas en su sitio y cree el sistema de menú para crear esa experiencia. No todas las páginas, publicaciones y enlaces deben aparecer en el mismo menú. En el caso de los menús de WordPress, menos ciertamente puede ser más.

¿Cómo estructura sus menús de WordPress? ¿Cuántos menús diferentes tiene su sitio?

Imagen destacada del artículo de Julia Tim / shutterstock.com