SENSATIONAL. How the hell do you not have more subscribers? This channel is really really good, not just for Divi, but for many other skills. Well done.
Extremly good tutorial. Absolutely easy to follow and to rebuild. Is there any possibility to insert a picture to the menu fullscreen? I don’t know where to put the css Code with the image.
Thanks for the kind words! To answer your question. It depends on how you want to implement this. If you want to show a different background image dependent on the link you are hovering, you would need to rework the JavaScript. But, if you want to change what is shown in the menu by using a Divi layout with images and more, it is easier to use something like Divi Mobile which will allow you to do that. diviengine.com/product/divi-mobile/
I have a problem with the cross i adjusted the left value but it doesnt change anithing, the cross is fixed at 35 px right to the hamburger icon. I used left-spacing the cross is right but the hamburger icon move with it to the left to so. How can i move this cross withouth touching the hamburger too ?
The part with the code didnt work for me. So I deleted the complete global header in the theme builder. Its gone everywhere, also in the visual builder. But if I visit the page from my smartphone, its still there. I cant get it away. I believe its because of the code. But I cant delete to code, because I deleted the complete header. Do you know how to solve this?
Thanks! To get something sticky you can either use the Divi Scroll settings under the advanced tab, or use some CSS. Something along the lines of position:fixed!important.
hello, i have aquestion. if i added the code and everything....how can i change color etc later on in the code again? or is it not possible? where can i find it?
Thanks for the kind words, Simone! on my install the png is showing. Maybe try setting the Z-index of your image to 9999 in Image Module > Advanced > Position and let me know how that goes.
@@DiviEngine Thank you so much for your support. The z-index did'nt work. But I found a way. I pushed the opened Menu 80 pixels down. And added 80 pixels padding bottom to the menu text to recenter it. Here is the css if anyone else wanna do the same: /* Fullscreen Menu Style when Opened*/ .de-burger-menu .opened #mobile_menu1 { width: 100vw; position: fixed; top: 80px; left: 0vw; height: calc(100vh - 80px);
Thank you very much for your tutorial @Divi Engine !! It's working well on my side. :-) Just a question : is it possible to prevent from scrolling vertically & horizontally when the fullscreen menu is open ? Thanks !
Hello Antoine! That is a good idea to add and we should be able to do that. Let me do some testing and maybe I'll post an update video. Make sure you sub so you don't miss it when it drops.
Hey there! Here I am 2 months later 😳 with an answer. In your global header, just open the settings for the menu module and go to Design > Icons > Hamburger Icon and change the size there. Hope this helps!
Hi there, James! All you need to do is open the settings for the Menu Module, head to design, icons, and then change the hamburger menu color. That should do it :)
Everything works except changing the position of the menu close button. I tried changing the position in the code. Unfortunately, it doesn't work. Anyone have a solution for this? >>>>>>> left: -40px; /* Close icon position. You might need to play with this to make it look right */ }
Hey there! Our Divi Mobile plugin will allow you to do that! More info on Divi Mobile here 👉 diviengine.com/product/divi-mobile/ We are running a sale until next week, so use coupon code SURPRISE20 for 20% off at checkout 🥳
SENSATIONAL. How the hell do you not have more subscribers? This channel is really really good, not just for Divi, but for many other skills. Well done.
This comment made our day! Thank you, James.
Great, very good, waiting for more tutorials ..... Thank you.
Thanks
This is a superb tutorial. Very grateful for your help and guidance x
You’re welcome 😊
Great tutorial. Easy to follow and it worked! Thanks for taking the time. Subscribed and liked ;)
Thanks for the sub!
Thank you for this tutorial 🙏
This is awesome! How can we prevent scrolling when the full menu screen is visible? Thanks!!!
Thanks for your example, it's very helpful. But I need to make dropdowns work and put a logo on the top left, how can I do it using your procedure?
Great work!
Loved it, keep making content like this...waiting for more ❤❤
Woop woop! More to come! Thanks Khalid 😁
Extremly good tutorial. Absolutely easy to follow and to rebuild. Is there any possibility to insert a picture to the menu fullscreen? I don’t know where to put the css Code with the image.
Thanks for the kind words! To answer your question. It depends on how you want to implement this. If you want to show a different background image dependent on the link you are hovering, you would need to rework the JavaScript. But, if you want to change what is shown in the menu by using a Divi layout with images and more, it is easier to use something like Divi Mobile which will allow you to do that. diviengine.com/product/divi-mobile/
@@DiviEngine thank you very much. I solve it with css.
Amazing Tutorial, can't wait to get to the next part!! @Divi Engine is there any way to have the menu to follow you as you scroll downwards?
Yes, you can set the menu to be a sticky menu. Go to the Section/Advanced/Scroll Effects and choose Stick to Top
is it possibile to put menu list in 2 columns? not in 1 as video.
I have a problem with the cross i adjusted the left value but it doesnt change anithing, the cross is fixed at 35 px right to the hamburger icon. I used left-spacing the cross is right but the hamburger icon move with it to the left to so. How can i move this cross withouth touching the hamburger too ?
The part with the code didnt work for me. So I deleted the complete global header in the theme builder. Its gone everywhere, also in the visual builder. But if I visit the page from my smartphone, its still there. I cant get it away. I believe its because of the code. But I cant delete to code, because I deleted the complete header. Do you know how to solve this?
i love the tutorial. i was wondering if you could tell me how to make this menu sticky? I couldn't get it to work on my own :-((
Thanks! To get something sticky you can either use the Divi Scroll settings under the advanced tab, or use some CSS. Something along the lines of position:fixed!important.
hello, i have aquestion. if i added the code and everything....how can i change color etc later on in the code again? or is it not possible? where can i find it?
Awesome, thank you ill follow this
This is great, but when I click on the link to get the code that web page is just blue with no content.
Thank you
Thanks for the kind words, Simone! on my install the png is showing. Maybe try setting the Z-index of your image to 9999 in Image Module > Advanced > Position and let me know how that goes.
@@DiviEngine Thank you so much for your support. The z-index did'nt work.
But I found a way. I pushed the opened Menu 80 pixels down. And added 80 pixels padding bottom to the menu text to recenter it.
Here is the css if anyone else wanna do the same:
/* Fullscreen Menu Style when Opened*/
.de-burger-menu .opened #mobile_menu1 {
width: 100vw;
position: fixed;
top: 80px;
left: 0vw;
height: calc(100vh - 80px);
Thank you very much for your tutorial @Divi Engine !! It's working well on my side. :-) Just a question : is it possible to prevent from scrolling vertically & horizontally when the fullscreen menu is open ? Thanks !
Hello Antoine! That is a good idea to add and we should be able to do that. Let me do some testing and maybe I'll post an update video. Make sure you sub so you don't miss it when it drops.
Hiya mate. This video was perfect. Explained everything really well. Do you know how to change the size of the actual burger menu icon!
Hey there! Here I am 2 months later 😳 with an answer.
In your global header, just open the settings for the menu module and go to Design > Icons > Hamburger Icon and change the size there.
Hope this helps!
@@DiviEngine Perfect thank you.
@@DiviEngine Do you also know how to add drop subcategories within the burger menu?
hi, my hamburger is ranging left? Any advice would be gratefully received.
I'm not able to get the menu to fade in on click. Anyone have any ideas?
hola tengo una licencia de 12€ .Puedo actualizar a total y pagar la diferencia??
How do I change the hamburger to white?
Hi there, James! All you need to do is open the settings for the Menu Module, head to design, icons, and then change the hamburger menu color. That should do it :)
Everything works except changing the position of the menu close button. I tried changing the position in the code. Unfortunately, it doesn't work. Anyone have a solution for this?
>>>>>>>
left: -40px; /* Close icon position. You might need to play with this to make it look right */
}
how can i do this only for moblie
Hey there! Our Divi Mobile plugin will allow you to do that!
More info on Divi Mobile here 👉 diviengine.com/product/divi-mobile/
We are running a sale until next week, so use coupon code SURPRISE20 for 20% off at checkout 🥳
So, Divi doesn't allow to make this with one click? I'm hating Divi. And where is the code you used on the tutorial?