Saltar al contenido principal

Cómo crear un mega menú en Divi

¿Estás buscando los mejores temas y complementos de WordPress?

Descarga los mejores complementos y temas de WordPress en Envato y crea fácilmente tu sitio web. Ya más de las descargas de 49.720.000. [EXCLUSIVO]

Los menús mega permiten a los usuarios ver más enlaces a la vez sin tener que desplazarse, sobrevolar y recordar el contenido de su menú. La mejor forma de entender el mega menú es que son menús desplegables en menús desplegables.

Por lo tanto, en lugar de su menú desplegable normal que muestra un submenú al pasar el mouse sobre sus enlaces principales primarios en su barra de navegación, un mega menú le permite tener enlaces adicionales y parientes de submenús en el menú desplegable.

Cómo agregar un mega menú a su barra de navegación

Inicie sesión en su panel de WordPress y navegue hasta Apariciones> Menús .

menú de wordpress divi.png

Cree un menú con cuatro enlaces principales con cada vínculo principal que tenga sus propios enlaces de submenú. En el siguiente ejemplo, agrego tres elementos de submenú debajo de cada uno de los cuatro enlaces de menú principal.

menu divi.png

Divi: ¡el mejor tema de WordPress de todos los tiempos!

más 554.000 descargas, Divi es el tema de WordPress más popular en el mundo. Es completo, fácil de usar y viene con más de plantillas gratuitas 62. [Recomendado]

Crea un enlace adicional para servir como un enlace de megamen. Para el siguiente ejemplo, llamo a este enlace "Principal". A continuación, arrastre los dos enlaces de menú principal (cada uno con sus enlaces de submenú) debajo del enlace Principal.

Ahora, para crear su Megamenú, necesita agregar una clase especial de CSS al enlace principal de nivel superior llamado "Principal". Para ello, haga clic en el enlace de opciones de pantalla en la parte superior de la página y asegúrese de que la opción de clase CSS esté marcada.

Crea fácilmente tu tienda en línea

Descargue gratis WooCommerce, los mejores complementos de comercio electrónico para vender sus productos físicos y digitales en WordPress. [GRATIS]

css classes divi.png

Finalmente, debe agregar una clase CSS al enlace "Principal" que acaba de crear. Haga clic en la flecha a la derecha de la opción de menú "Principal" para alternar las opciones de configuración adicionales. Busque el cuadro de texto etiquetado Clases CSS e ingrese la clase "mega-menú".

mega menu divi.png

Ahora, cuando vuelvas a cargar tu página, puedes ver que todos los menús anteriores se han colocado en el menú gigante debajo de este enlace, el Menú Mega.

mega menu divi example.png

Crea fácilmente tu blog con SiteGround

SiteGround le permite crear su blog de WordPress en unos pocos clics. Nombre de dominio gratis, alojamiento seguro, SSL, transferencia y mucho más ... [Recomendado]

Eso es todo por este tutoriel, Espero que te permita crear un mega menú en divi en toda simplicidad.

Dejar un comentario

Su dirección de correo electrónico no será publicada. Los campos necesarios están marcados con *

Este sitio usa Akismet para reducir los no deseados. Obtenga más información sobre cómo se utilizan sus datos de comentarios.

Volver arriba
14 acciones
cuota6
Tweet2
Guardar6
WhatsApp