Aprende en este tutorial cómo conseguir que el menú móvil de Genesis Sample esté siempre visible al pie de la pantalla mediante código.
Una de las ventajas de ser suscriptor de Código Genesis es que puedes proponer nuevos tutoriales.
El otro día Vicente me propuso un tutorial para dejar el menú para móviles fijo y siempre visible en la parte inferior de la pantalla.
Esta es una solución interesante ya que, de esta manera, el menú queda más accesible que en la parte superior, especialmente en móviles grandes.
Así que me puse manos a la obra tomando como referencia Genesis Sample.
Este sería el resultado final:
¿Tú también quieres colocar el menú hamburguesa en la parte inferior de la pantalla?
Pues sigue leyendo. 😉
Snippet para mostrar el menú de hamburguesa en la parte inferior de la pantalla en Genesis Sample
Añade las siguiente líneas al final del fichero style.css:
Para ver este código y los otros 1001 snippets de esta web,
identifícate o suscríbete aquí.
Con esto consigues posicionar el menú hamburguesa en la parte inferior de la pantalla en móviles.
También recolocas el menú cuando se abre, para que quede en la parte inferior y al alcance de la mano para tus visitas.
Puedes modificar la posición del menú y/o modificar los colores del mismo con pequeñas variaciones en el CSS.
A partir de ahora, cuando alguien visite tu página (o la de tu cliente) desde un smartphone, tendrás el menú siempre a mano.
Conclusiones
Con este tutorial ya sabes cómo enviar el menú de hamburguesa de Genesis Sample a la parte inferior de la pantalla en móviles.
Aunque este snippet está pensado para una plantilla concreta, puede servirte de guía para modificar otros child themes de Genesis.
Si tienes alguna petición en particular puedes hacerlo a través del formulario de contacto.
Ventajas de ser suscriptor. 😉
