Hola bienvenido bienvenida una vez más a otro tutorial de OV Divi. En este tutorial gratuito de divi y wordpress aprenderás a diseñar un menú fijo inferior con iconos simulando el menú de una aplicación móvil. Este menú lo haremos con el nuevo generador de temas de divi (divi theme builder) y será completamente responsive, es decir, se verá perfectamente tanto en escritorio, tabletas y móviles.
Con este tutorial además de que aprenderás a realizar una composición de un menú con 5 columnas (aunque puede ser con las columnas que quieras) te enseñaré un truco que siempre uso en mis diseños para mostrar en línea más de una columna en móvil, es decir, sabemos que divi por defecto apila las columnas una abajo de otra en móviles y con este truco mostraremos las 5 columnas en una sola fila en móvil de forma muy fácil.
Bueno ya sabes que soy de los que no les gusta escribir mucho, así que mejor dale play al video y aprende a realizar este hermoso menú tipo app.
Hola!
Me estoy volviendo fan de tus videos!
Te comento que no logré algún paso y no me sale bien para celular, sale el menú todo junto, habrá solución para esto?
Ojala puedas asesorarme!
Saludos!
Hola Alfonso, ¿A qué te refieres con que sale todo junto? Necesito ver tu ejercicio para saber en realidad que pasa, si lo tienes en línea envíame el enlace por fa.
Wow gracias por contestar
La web es https://californiavinosylicores.com/recompensas/ y mi problema es en la vista de celular.
Lo que logre hacer es que el menú se ve «apretado» no se como explicarlo, te puedo mandar una foto
En verdad te agradezco mucho en contestar
Saludos
Al parecer lo estás haciendo mal Alfonso. Veo que en la fila tienes un max-width: 2147%; <--- eso está mal debería tener 100% y si tienes 6 columnas debes colocarle un ancho a cada columna de 16.6% porque 100 / 6 = 16.6...
buenas noche oscar aplique todo lo del tutorial pero el menu no se me ve en mi pagina me puedes colaborar porfa, es la pagina de fundacooedumag, tu tienes la entra a wp. gracias
Seguramente algo estás copiando mal Alexander. Debes seguir correctamente el paso por paso porque con algo que no hagas bien (un signo, letra, etc. de más) no te va a funcionar.
Aunque creo que ya te respondí en youtube y en tu sitio he visto que si se muestra el menú.
Saludos.
Hola, me gusta el menú fijo inferior con iconos que propones en el tutoría, pero me gustaría poder poner ese menú solo en versión Mobil, y en versión escritorio ponerlo superior y diferente, sin iconos, por ejemplo. Cómo se podría hacer??
Hola Lorena, es fácil. Te creas dos secciones, una con el menú tipo app, esta sección la ocultas para escritorio desde los ajustes de la sección > Avanzado > Visibilidad… Y posteriormente te haces otra sección con el diseño que quieras y está la ocultas para tabletas y móviles…
Hola Oscar de verdad que es genial las recomendaciones y trucos que mencionas; ya he realizado varios cambios, sin embargo tengo una duda.
Cómo hago para que uno de los iconos del menu que es un carrito de compra cambie cuando el usuario mande un articulo al carrito para compra?
Muchas gracias y espero tus comentarios.
Roberto Rojo
Hola Roberto, ¿a qué te refieres que cambie? o ¿a qué quieres que cambie el icono de carrito? Si deseas agregarle un contador al icono del carrito tengo este tutorial premium donde logramos esa funcionalidad 🙂