Tutorial Divi: Cómo crear un mega menú sin plugins ni códigos

Los mena menús son muy populares porque muestran elementos de navegación desplegables de un modo en que son más fáciles de visualizar.

Puedes hacer mega menús de muchas maneras, pero lo más habitual es recurrir a plugins como Max Mega Menu (gratis) o UberMenu (de pago).

De lo que estoy hablando es de pasar de algo así…

A algo como esto otro…

Ahora bien, si usas Divi no es necesario instalar ningún plugin adicional para crear mega menús, ni siquiera añadir ningún tipo de código para generarlos, Divi ya integra esta posibilidad de convertir cualquier de tus menús en  un  mega menú, y solo donde tú quieras.

¿Quieres saber cómo se hacen?

Las opciones de pantalla de WordPress

No me cansaré de repetir que siempre que estés en una pantalla de WordPress, la que sea, revises las Opciones de pantalla a ver qué te ofrecen.

Pues bien, ve a Apariencia > Menús y abre las Opciones de pantalla para activar la casilla de Clases CSS.

Esto añadirá una nueva caja en los ajustes de cada elemento de tus menús.

La magia del CSS

Pues sí, la magia del CSS está en hacer que las webs cobren vida y den lo mejor de sí mismas, y Divi ya tiene clases CSS para crear mega menús en su hoja de estilos, y tiene unas cuantas líneas.

Así que lo único que tienes que hacer es, en la caja de Clases CSS recién activada en tus menús, añadir el nombre de la clase, que no es ni más ni menos que mega-menu, así…

Guarda los cambios y habrás convertido tu menú normal en un mega menú.

¿Dónde pongo el mega menú?

La única decisión que debes tomar es dónde poner el nombre de la clase CSS mega-menu, en definitiva, a partir de qué elemento de tu menú quieres crear el mega menú.

Y en la cuestión está la respuesta: en el elemento a partir del que quieras que sus subelementos se muestren en un mega menú en vez de en un menú desplegable normal.

O sea, debes añadir el nombre de la clase mega-menu en el elemento de tu menú padre, del que colgarán el resto de elementos.

Por supuesto, un mega menú muestra todo su potencial cuando hay bajo él varios subelementos, elementos desplegables.

¿Qué más puedo hacer?

Si, además, combinas este truco con el de mostrar imágenes en los menús podrás crear mega menús desplegables realmente atractivos.

Lo mejor del método Divi es que puedes tener en un mismo menú desplegables normales y en mega menú, depende de cuál se vea mejor en cada caso.

Otro día te cuento otro truco con los mega menús en Divi.

Valora este artículo para mejorar la calidad del blog ...

FlojitoNo está malEstá bienMe ha servidoFantástico (4 votos, promedio: 5,00 de 5)
Cargando…

Autor: Fernando

Fernando Tellado, apasionado de WordPress, profesor, consultor y ponente. Maquero cansino, padre de tres hijos y de una perrita Beagle, Bilbaíno de nacimiento, Español de corazón y ciudadano de donde me quieran.Autor del libro WordPress - La tela de la araña. Mi blog personal es Navegando con red, donde he crecido como escritor en la red y ofrezco mis visiones acerca de la Web 2.0 y la blogosfera.

Comparte esta entrada en
468 ad

ESTA WEB UTILIZA COOKIES PARA OFRECER LA MEJOR EXPERIENCIA POSIBLE. SI SIGUES NAVEGANDO DAS TU CONSENTIMIENTO PARA LA ACEPTACIÓN DE COOKIES Y NUESTRA POLÍTICA DE PRIVACIDAD más información

Los ajustes de cookies de esta web están configurados para "permitir cookies" y así ofrecerte la mejor experiencia de navegación posible. Si sigues utilizando esta web sin cambiar tus ajustes de cookies o haces clic en "Aceptar" estarás dando tu consentimiento a esto.

Cerrar