[Jefferson Maldonado]

¡Hola Marta! 👋 Qué gusto verte tan metida en un proyecto tan completo como este.

📂 Sobre el mega-menú y las categorías colapsables

Si estás creando un mega-menú con Divi y CSS personalizado, lograr ese efecto de “categorías desplegables dentro del submenú” puede ser un poco más complejo solo con CSS, ya que requiere un poco de interacción tipo toggle, que normalmente se hace con JavaScript.

Pero sí que puedes hacerlo sin plugins de pago, combinando HTML personalizado dentro del mega-menú + algo de JS básico (o incluso con details y summary si buscas una solución rápida y accesible). Algo así como:

<details>
  <summary>Categoría 1</summary>
  <ul>
    <li>Subcategoría 1</li>
    <li>Subcategoría 2</li>
  </ul>
</details>

Con un poco de estilos puedes hacer que el summary se vea como un enlace con flecha. Divi te permite insertar HTML dentro de menús usando widgets personalizados o incluso módulos de código.

🧱 Sobre las columnas del menú

Para ajustar el mega-menú a 6 columnas (en lugar de 4), asegúrate de personalizar el width del contenedor del mega-menú y luego forzar el número de columnas así:

.et_pb_menu .et_pb_menu_inner > ul > li ul {
  display: grid;
  grid-template-columns: repeat(6, 1fr);
  gap: 10px;
}

Asegúrate de que esa clase esté apuntando bien al submenú donde necesitas el grid.

🔧 Alternativa con plugin gratuito

Si se te complica todo esto y necesitas algo más directo, podrías probar con el plugin Max Mega Menu. Tiene una versión gratuita muy útil, se integra con el menú de WordPress y te permite hacer menús con columnas, acordeones, íconos, etc., sin tener que escribir tanto código.

Si me compartes un pantallazo o un boceto de cómo debería verse el resultado final, incluso podría ayudarte con un snippet más exacto. ¡Ánimo con ese diseño! 💪✨

[MARTA MAYOR AGORRETA]

Holaaaaaaaaaaaaa!!! No consigo (con el Max Mega Menu) que el menú ocupe el ancho entero, solo me “hace caso” en el espacio que me ocupa el menú y las columnas se ven fatal!

De todas formas lo he puesto con la estética normal, que les encaja pero necesitaría que los desplegables fueran mas anchos… (el caso del primer desplegable de la penúltima categoría)

Muchas gracias!!!!!

Tengo otro mega menú que intentaré hacerlo con el código que me facilitaas!!! 🙂

menuiberoptics-corto.jpg 108 KB Image File - Click to view

Opciones

• Copy Download Link

[MARTA MAYOR AGORRETA]

holaaa!! no consigo ampliar el espacio de la columna tal y como se ve en el pantallazo anterior😩! alguna solución por favor??

Gracias!!😀

[Jefferson Maldonado]

¡Hola Martha! un gusto saludarte.

Te recomendamos revisar el curso de CSS para Divi, allí hay un plugin que te ayudará a generar el CSS que necesitas para personalizar el menú tal como quieres.

Espero que esta info te sea de ayuda. Para cualquier otra cosa, aquí me tienes 😉🖐