Mega menús verdaderos en Oxygen Builder

En este artículo, veremos algunas formas de agregar un mega menú "real" al Oxygen Builder. Los componentes de menú incorporados son buenos para menús simples al crear encabezados con Oxygen, pero si desea una verdadera funcionalidad de megamenú, es mejor buscar en otra parte.

En este artículo, vamos a discutir cómo agregar un mega menú en Oxygen.

¿Qué es un mega menú?

Si alguna vez ha usado un menú en un sitio web que contenía algo más que enlaces, eso es lo que es un megamenú. Varían en complejidad, desde iconos de imágenes simples hasta áreas pobladas dinámicamente.

Pueden tener diseños de una sola columna, diseños de múltiples columnas, múltiples filas, archivos de mampostería y más. Por supuesto, no querrás complicarte, porque para eso están las páginas.

Si se hacen correctamente, pueden hacer que la navegación del sitio web sea mucho más fácil para sus visitantes.

Oxygen le permite crear menús desplegables simples, pero cuando se trata de la funcionalidad de megamenú, no le quedan muchas opciones.

Cómo agregar un mega menú a Oxygen

Este artículo analizará dos formas principales de agregar un megamenú a Oxygen. La primera forma se puede hacer completamente en Oxygen sin complementos de terceros. Esto es bueno para menús simples. Sigue los pasos de un tutorial publicado por el equipo oficial detrás de Oxygen. Este es el método que usaron para crear los menús desplegables que se ven en el sitio Oxygenbuilder.com.

La segunda opción utiliza un complemento de terceros que le brinda mucha más funcionalidad cuando se trata de mega menús en Oxygen Builder. Si está buscando crear menús de varias columnas que se completen dinámicamente, esta es su mejor opción.

Por supuesto, hay opciones adicionales que se pueden usar si tiene un buen conocimiento de HTML, CSS, JavaScript y quizás PHP. Sin embargo, eso está fuera del alcance de este artículo. Sin embargo, si está familiarizado con él, podría ser una buena tercera opción para incorporar un mega menú en Oxygen, que no requeriría un complemento de terceros.

Agregar de forma nativa un mega menú en Oxygen

Esta sección se ejecutará a través de los pasos básicos discutidos en el tutorial de YouTube. Si está buscando implementar este tipo de menú en su propio sitio web, le recomendamos leer el tutorial oficial y ver el video de YouTube anterior.

Para agregar de forma nativa un megamenú en Oxygen, primero debe crear los elementos de menú iniciales. Esto no se hace con el componente de menú, sino que se hace creando divs, llenándolos con texto y envolviéndolos en enlaces. Esto es bastante fácil de hacer con oxígeno.

Una vez que el menú inicial está allí, es hora de crear el megamenú desplegable.

Esto se hace creando un div debajo del enlace del menú que contendrá todo el contenido en el menú desplegable. Una vez que se crea el div desplegable (mire el video para comprender la estructura real detrás de él), se coloca de manera absoluta y se alterna para que sea visible al pasar el mouse sobre su enlace de menú respectivo.

La implementación de este mega menú es bastante simple, especialmente si sigues el tutorial de YouTube. Le permite usar cualquier bloque disponible en Oxygen Builder. También puede hacer uso de las funciones de visibilidad condicional integradas para mostrar y ocultar cosas según las funciones de los usuarios.

Sin embargo, agregar este megamenú requiere un poco de trabajo y cuando la estructura se vuelve compleja, la implementación también lo hace. También es una creación manual, lo que significa que no se actualizará automáticamente con contenido nuevo. Otro gran problema es que no funciona bien con dispositivos móviles. Simplemente puede ocultar toda la instalación del menú en el móvil y usar otro menú básico, pero esto no es muy práctico.

Dependiendo de por qué está buscando agregar un mega menú a su sitio web de WordPress (construido con Oxygen), es posible que desee usar la ruta dos.

Mega complemento de menú para oxígeno

En lugar de agregar manualmente un megamenú, usar un complemento de terceros podría ser una mejor opción en algunas circunstancias. Especialmente si tiene un menú que cambia mucho, un complemento podría terminar ahorrándole mucho tiempo.

Hay un montón de complementos de megamenú, y probamos un montón cuando buscamos incorporar esta funcionalidad en los sitios web de los clientes creados con Oxygen. al buscar el complemento, nuestro criterio fue que debía ser fácil de usar, dinámico, bien diseñado y completamente compatible con Oxygen (como saben, hay muchos complementos que simplemente no lo son).

De los varios complementos que probamos, WP Mega Menu fue la mejor opción que no tuvo problemas de compatibilidad con Oxygen Builder.

Hay una versión gratuita y una versión pro. La versión pro cuesta $ 29.00 por año. la versión gratuita funciona bien, pero está un poco restringida en lo que respecta a la funcionalidad avanzada. Si está buscando incorporar un megamenú en el sitio web de un cliente creado con Oxygen Builder, la versión pro es probablemente su mejor opción.

Nos gusta este complemento porque no solo es fácil de usar para nosotros, sino que nuestros clientes pueden actualizarlo rápidamente sin romper todo nuestro sitio web creado con Oxygen. Tiene una interfaz simple de arrastrar y soltar y viene con widgets prediseñados. Básicamente, es un “constructor de menús”.

También responde, lo cual es un problema importante cuando se usa el método uno para agregar un megamenú a su sitio web de Oxygen Builder.

Después de instalar el complemento en su sitio web, incorporarlo en su sitio es bastante fácil de hacer. Puede elegir que el complemento reemplace el menú predeterminado, agregado a través de un código abreviado o usando un fragmento de PHP. Vamos a incorporarlo usando PHP. esto es fácil de hacer en Oxygen, simplemente agregue un componente de bloque de código y péguelo en el siguiente PHP (reemplace la ID con la ID numérica de su menú)

 <?php wp_megamenu( array ( 'menu' => 'ID' )); ?>
 Lenguaje de código: HTML, XML ( xml )

Puede colocarlo en cualquier lugar, pero le recomendamos que utilice una plantilla general de encabezado y pie de página. El ancho del bloque de código afecta el menú en sí, así que asegúrese de configurarlo para que sea lo suficientemente ancho para el contenido.

Crear el mega menú es bastante fácil. Con un generador visual, puede arrastrar y soltar elementos en un diseño de fila/columna establecido.

Hay algunas funcionalidades bastante avanzadas con este complemento, como una búsqueda de pantalla completa, widgets dinámicos y más. Si está buscando una manera fácil de agregar un megamenú a su sitio web de Oxygen, esta es su mejor opción.

Si crea sitios web para clientes y necesita brindarles una herramienta simple que puedan usar para editar el menú, esta es una excelente opción debido a la simplicidad.

Conclusión

Este artículo debería haber cubierto dos formas que puede usar para agregar fácilmente un mega menú a su sitio web de Oxygen Builder. Los mega menús pueden agregar funcionalidad y darle a su sitio web una sensación premium. Es bastante fácil agregar 1 usando CSS y componentes Oxygen predeterminados. también puede usar un complemento de terceros para agregar un megamenú a Oxygen.

Si tiene alguna pregunta, ¡déjela en la sección de comentarios a continuación!