Tutorial Divi: Hacer fijo también el menú móvil

Por si no te has dado cuenta, aunque tengas configurado el menú de Divi para que sea fijo, para que te persiga a menudo que se navega, desde móviles se queda arriba, no funciona el menú fijo.

En mi humilde opinión tiene cierto sentido, pues en un dispositivo móvil el poco espacio de pantalla disponible debe dedicarse al contenido, sin que lo ocupen otros elementos como menús, etc.

Ahora bien, si tú prefieres que también en móviles el menú de navegación persiga por la pantalla a los usuarios puedes modificarlo con este truco en dos pasos.

Haz fijo el menú móvil

Sencillo, para conseguir que tu menú de navegación siga al usuario a medida que navega simplemente añade el siguiente código a la sección CSS adicional del Personalizador:

/* Menú fijo Divi también en móvil */
@media (max-width: 980px) {
.et_non_fixed_nav.et_transparent_nav #main-header, .et_non_fixed_nav.et_transparent_nav #top-header, .et_fixed_nav #main-header, .et_fixed_nav #top-header {
    position: fixed !important; } }

Que se pueda hacer scroll en el menú móvil desplegable

Ahora bien, un menú móvil con subelementos siempre tiene un problema, y es que si tiene muchas páginas en el desplegable llega un punto en que topa con la parte inferior de la pantalla y no se puede seguir navegando. Te ha pasado ¿verdad?

Así que este otro truco sirve para que puedas hacer scroll en los elementos desplegables de tu menú móvil.

De nuevo, simplemente añade el código al CSS adicional del Personalizador:

/* Scroll en menú móvil desplegable */
.et_mobile_menu {
    overflow: scroll !important;
    max-height: 83vh;
}

Por supuesto, no se te olvide guardar y publicar los cambios para que Divi tenga también el menú fijo en móviles

VALORA Y COMPARTE ESTE ARTÍCULO PARA MEJORAR LA CALIDAD DEL BLOG…
(15 votos, promedio: 4.7)

¿Te gustó este artículo? ¡Ni te imaginas lo que te estás perdiendo en YouTube!

9 comentarios en “Tutorial Divi: Hacer fijo también el menú móvil”

  1. Facebook User

    Yo utilizo el tema Total, ¿estos trucos podrían ser válidos para este tema? Supongo que no servirán porque utilizará otras clases de objetos o funciones.
    Pero ¿podrías orientarme de cómo buscar? Soy nueva en WordPress.
    O si tienes tiempo para dedicarle posts al tema Total… mejor. Siempre voy con poco tiempo para dedicarle a toquetear el WP.
    Te lo agradecería un montón.

    Otra cosa, ¿Qué tiene el DIVI que últimamente lo veo por todas partes?¿Cuándo salió?

    1. No vale para Total tal cual, cada tema tiene sus propias clases CSS, pero puedes adaptarlo identificando la clase CSS que se aplique al menú móvil, si lo tiene, que no lo he usado. Conozco temas parecidos, como Bridge, pero no Total.

      Tienes que abrir el inspector web de tu navegador para encontrar la clase css adecuada, y luego ya si aplicar este truco, u otros.

      Divi viene a ser la evolución de temas como Total o Bridge, pero principalmente porque en vez de usar Visual Composer utiliza un maquetador propio que funciona mil veces mejor. Ya lleva unos añitos con nosotros, desde 2013 y ha mejorado muchísimo la verdad, ahora mismo es el rey de la maquetación

      1. Facebook User

        Desde luego, con el tema Total no encuentro ayudas o truquitos. Y he mirado DIVI, parece que hay que pagar anualmente, ¿es necesario para seguir usando el tema? Yo solo lo voy a usar para mi web de empresa. Me preocupa que no pueda actualizarlo si no sigo pagando la cuota anual.
        El tema Total lo tengo hace unos 2 ó 3 años, solo pagué al adquirirlo y sigo recibiendo las actualizaciones.

        1. De Total recibirás actualizaciones del tema pero no de Visual Composer, que es lo que realmente vale.

          Y sí, Divi lo pagas anualmente, o de por vida si lo prefieres, pero no solo por Divi sino que te dan otros 80 temas y unos cuantos plugins (buenísimos)

          Y no, no deja de funcionar si luego no pagas, pero hay que pagar por actualizar (y tener soporte).

  2. Jesus Jimenez

    Hola Fernando,
    Buenísimo tutorial como todos los que haces!!
    Lo he probado pero me come mucha pantalla en el móvil como tú bien dices. Lo que sí me gustaría es poder dejar el menú secundario fijo sólamente, ¿como podría hacerlo?

    Gracias!!

Deja un comentario

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

 

Ir arriba Ir al contenido