¡Crear un submenú, o un menú de varios niveles, en WordPress es bastante fácil! WordPress tiene una guía para crear menús de varios niveles perfectamente explicada en su documentación, aproximadamente a la mitad de la guía general para crear menús.
Entonces, ¿por qué tenemos una publicación sobre algo que WordPress ya ha cubierto? Bueno… si estás creando un submenú en WordPress, es posible que te hayas encontrado con un problema:WordPress, de forma predeterminada, solo quiere enlaces en los que se pueda hacer clic en su menú. A veces, sin embargo, desea un elemento de menú de nivel superior que exista simplemente para proporcionar a los visitantes de su sitio web acceso a las subpáginas debajo de él. Es una tarea relativamente fácil de hacer, pero cómo ¡Hacerlo definitivamente no está claro!
Le mostraremos cómo hacer que esto suceda y luego veremos algunos ajustes más avanzados para mejorar la facilidad de uso del menú después de hacerlo.
Cómo agregar una etiqueta de submenú no vinculada en WordPress
- En el administrador de WordPress, ve a Apariencia> Menús
- En la barra lateral izquierda de esa página, haga clic en "Enlace personalizado"
- Establezca la URL simplemente:
# - Establezca el valor del 'texto del enlace' para que sea el nombre que le gustaría que se muestre en el menú
- Ahora agregue las páginas reales (subpáginas) que desea que aparezcan bajo este encabezado y arrástrelas y suéltelas en su lugar, colocándolas debajo del elemento de menú que acaba de agregar. Aparecerán sangrados cuando sean elementos de submenú.
¡Eso es todo! Esa es la versión básica de la misma. El menú estará allí con sus opciones de submenú y cuando haga clic en él, no lo llevará a otra página.
Cómo hacer que se vea y se comporte menos como un enlace
Y ahora la adición algo más avanzada (pero no realmente).
El problema que persiste, desde el punto de vista de la usabilidad, es que cuando un visitante del sitio web pasa el mouse sobre el enlace, todavía "siente" que debería poder hacer clic en él. Tiene el cursor para un enlace, actúa como un enlace, solo apunta a un lugar que no va a ninguna parte. Probablemente esto esté bien, pero si te vuelve loco (¡hola, soy yo!), hay una forma de evitarlo.
Deberá agregar algo de CSS a su sitio. Vaya a Apariencia> Personalizador y abra la sección CSS personalizado y pegue esto allí, luego guarde sus cambios:
a[href="#"] {
pointer-events: none;
cursor: default;
}
Este CSS dice:ya no se podrá hacer clic en todos los enlaces que tengan "#" como URL de destino (pointer-events: none; ) y configura el cursor para que no sea la mano (cursor: default; ).
Ahora tiene un encabezado en su menú que no va a ninguna parte, puede tener subelementos debajo y no me duele la cabeza desde el punto de vista de la usabilidad.
¿Tu servidor web te ayuda con WordPress?
¿No? Tal vez sea hora de un cambio. ¡Echa un vistazo a nuestro alojamiento de WordPress canadiense de alto rendimiento!
Lee mas