19 Aug 2024 It works like a charm and is so much easier than the guide from Divi's blog. Thank you so much. I don't understand why Divi doesn't provide this option.
Great Tutorial... you're the first one with this kind of tutorial where the collapsible is working too for mega menus! Well done Nelson... really well done. Thanks for this
Super helpful. I saw similar things from other RUclipsrs but unfortunately, none of them is working luckily yours is working fine. Highly appreciated your efficient video I become your subscriber and I did like it. comments, follow, and all notifications.
Needed some tweaking having not followed the other tutorials, where it would change the icon of the mobile menu button itself when opened for instance, but it did the trick in the end thanks man
lifesaver thank you!!!! my god the divi blog/video is tedious, dragged out and pointless. Made my brain hurt. Yours literally took 10 seconds to do and it worked - thank you!
Another amazing tutorial. This was very helpful for me while building a menu on a recent project. Your tutorials on working with divi and customizing with css are the best.
Thank you very much for this great video. So far it worked. Just one thing, that looks different on my site. My subpages don't appear under the upper page, they appear on the right side, which does not look good. What could be the reason for this issue? Thanks
This is so nice because i had a diferent code from before but this would not work while using the DIVI THEME BUILDER and this worked perfectly, thank you so much...
Thank you! The collapsing works perfectly. Unfortunately, the uncollapsing doesn't - the icon doesn't show. I double-checked the code and posted this issue on the forum as well. I noticed some others had the same issue, but it's not resolved yet :( Not sure what's going on!
hi can u plz tell me how to design menu like your website, especially the logo section? little to top little down even header section also not broad .can u plz one video for this or anything .thank u
Great tutorial! One question I keep running into though: where do the lines underneath each list item in the menu come from? I can't seem to get rid of those lines. Does anyone know?
Hi Daniel, I have the same issue. I can't see any down arrows, just grey lines in the centre of the menu item. did you find a solution for this? Thanks
good day. This tutorial is very helpful but I want to ask is there a way to apply this one to a vertical menu that serves a side bar or can we apply this to the side bar itself?
I entered the CSS and it worked but the arrows in the menu didn't appear. Instead, I see light grey slivers you can barely see. How do I edit the icons (arrows/grey slivers) in the menu if the arrows didn't show up or if they aren't arrows after entering the code? Great tutorial by the way and many thanks!
@@PeeAyeCreative it only works for the original menu not the theme builder menu.... and I know why because I use an vertical menu from you other tutorial
Amazing Tutorial, everything works perfectly fine! But, do you have a solution for the parent menu items ? The child menu items only open, when I hit the toggle. When I click on the menu item (parent) itself, the menu just closes. Would be great if the child items would also open if you click on the parent item text. Hope it’s understandable 😂
I had the same problem. Codes here helped fix it for me and menus working good on mobile now, for anyone else in the same situation. ruclips.net/video/3IQ-b2bEqyg/видео.html
Hi. How to make this work properly with gtranslate plugin? When i set gtranslate to show along with the menu, the gtranslate dropdown list wont show. Thanks
I used the snippets and it all works well. But is the menu item that now has collapsed sub menus is always bold and the little arrow next to it is green. I need to change both these things. I would like the menu item to not be bold and the colour of the icon to not be green. I cant find in the code where to change it
Same question here - I have a customer that does not like the icon expansion and wants the submenu to expand when you click on the top menu item. Thanks in advance
Hello, good day, I wanted to comment, I used the code and it works perfectly, except for a small problem, the menu appears only on the pages but it does not appear on the posts, I am using the divi constructor to apply a sidebar in all the posts, I don’t know if that’s the problem, but before adding the code that didn’t happen, any solution, thank you very much
Thank you soo much, Sir. Actually I am having same issue what Elementor. When I refresh or load any page, the dropdown menu expends for a sec, and collapse automatically. I tried many things but couldn't fixed. Will this work with Elementor?
Thanks! Worked fine and helped a lot...but :-) I've got two (not one) little down arrows...tested it on serveral installations. Do you have any idea why? Thx
Hello very good tutorial thank you man:) i try to fix that code to my site from right to left letters... and its getting big mess// the arrows are on the letters on the right side. how can i fix the arrows to be on the left side? is there an easy way for that in divi?
I really need your help, sir. I did use your snippet and everything was working well until a few days ago the mobile menu and logo stop showing. I have tried all I can to make it to work but I can not do it. Can you please help me with a fix to it. The menu is working well on pc but not on mobile.
@@PeeAyeCreative thanks, but I'm confused it's not working on me. I mean instead of just clicking on the icon on the left, I can also click on the label of the parent link, then it should do dropdown the submenu.
@@PeeAyeCreativegood devs are going to write a child theme function or a plugin extension to cover this and likely would avoid using jQuery or recommend that the client uses native Gutenberg instead. A good dev isn't going to inject code into the browser even if its just css. You can be aware of a problem and not care about correcting it and that is a blind spot. Hope that helps!
Your statements are very odd, and quite frankly, wrong. A developer would certainly not do what you said. I'm not sure where your comment is coming from, but it's really strange.
19 Aug 2024
It works like a charm and is so much easier than the guide from Divi's blog. Thank you so much.
I don't understand why Divi doesn't provide this option.
I'm so glad this worked for you!
Great Tutorial... you're the first one with this kind of tutorial where the collapsible is working too for mega menus! Well done Nelson... really well done. Thanks for this
Thanks Benny!
Super helpful. I saw similar things from other RUclipsrs but unfortunately, none of them is working luckily yours is working fine. Highly appreciated your efficient video I become your subscriber and I did like it. comments, follow, and all notifications.
That's great 👍 I'm so glad it works for you and I hope you enjoy all of our tutorials!
Needed some tweaking having not followed the other tutorials, where it would change the icon of the mobile menu button itself when opened for instance, but it did the trick in the end thanks man
This works beautifully! Thank you for sharing!
Exactly what I needed. Thanks for sharing the code and demonstrating exactly where to put it. It worked perfectly on the first try.
lifesaver thank you!!!! my god the divi blog/video is tedious, dragged out and pointless. Made my brain hurt. Yours literally took 10 seconds to do and it worked - thank you!
How did you get it to work? It does not work for me at all.
You're so welcome!! I'm glad to hear it!
Brilliant! I'm new to WordPress and Divi and this is really easy to follow, thank you.
That's great, welcome! I'm glad it was easy to follow!
You're so talented. It was a great tutorial. Thank you so much.
You are so welcome!
Another amazing tutorial. This was very helpful for me while building a menu on a recent project. Your tutorials on working with divi and customizing with css are the best.
Thanks Edgar, I'm so glad you like the tutorials!
Thank you very much for this great video. So far it worked. Just one thing, that looks different on my site.
My subpages don't appear under the upper page, they appear on the right side, which does not look good. What could be the reason for this issue?
Thanks
Thanks you soooooooooooooooooo much ! not the first time that you save me with your tricks... i just put your website in my favs ;-)
O M G. This has to be heard and go viral. You literally save my life Nelson, thanks a million!
Thank you so much. Do provide more such tutorials.
You're welcome, will do!
@@PeeAyeCreative Thank you so much
AWESOME MAN! Thanks a lot ! Its a Great Tutorial
You're welcome, so glad you liked it!
Great! Congratulations on your interest in teaching
Thank you!
Thanks for posting, very helpful and easy to follow!
You're very welcome!
So helpful, easy and fast!! Really well done. Thank you!
You're welcome!
Thank you SO much!!! This is exactly what I was looking for.
I'm so glad you like it, you're welcome!
Amazing Channel Outstanding information provider. and also tell makhan method.
Excelent as always. A very useful tutorial for the collapsible menu. Marcelo from Argentina.😃
Glad it was helpful!
This is so nice because i had a diferent code from before but this would not work while using the DIVI THEME BUILDER and this worked perfectly, thank you so much...
That's great, so glad you can use this for the Menu module also!
Thank you! The collapsing works perfectly. Unfortunately, the uncollapsing doesn't - the icon doesn't show. I double-checked the code and posted this issue on the forum as well. I noticed some others had the same issue, but it's not resolved yet :( Not sure what's going on!
Danke!
You're welcome!
thank you for this amazing tutorial
You're very welcome!
Great tutorial thank you!
Glad it was helpful!
Thank you Nelson. Perfect for me!!
That's great to hear!
That was amazing bro! Thanks and keep going
Thanks! Will do!
hi can u plz tell me how to design menu like your website, especially the logo section? little to top little down even header section also not broad .can u plz one video for this or anything .thank u
wow, thanks for video, this tutorial help me lots.
You're welcome!
THANK YOU good man for this video and all other great knowledge you share!
You're very welcome!
Loved this! So easy and fast!! Thank you
Thank you for this video! It was not something I was looking forward to but your video made it a cinch!
Worked like a charm!
Awesome, thanks for sharing!
Thanks so much for this, really really helpful
You're very welcome!
Thanks for saving my day!
Really nice tuts, thanks so much for the share!
YOU ARE A TRUE HERO!
Thanks ;)
Many thanks, but how can i have it so that the text opens/collapses like the icon on the right?
Great tutorial! One question I keep running into though: where do the lines underneath each list item in the menu come from? I can't seem to get rid of those lines. Does anyone know?
Hi Daniel, I have the same issue. I can't see any down arrows, just grey lines in the centre of the menu item. did you find a solution for this? Thanks
It is a border bottom on the list items "li"
Is there something additional to add to the code as the 2nd and 3rd tier dropdown parent menu items are not clickable but the 1st tier is? Thanks
Great tutorial, thanks. All of my submenu text is right aligned. How do I move it to the centre or left align it? Thanks
Hi Edward, for styling the mobile menu we have a separate tutorial, I suggest checking that out: ruclips.net/video/0MST8hJ8m0Q/видео.html
good day. This tutorial is very helpful but I want to ask is there a way to apply this one to a vertical menu that serves a side bar or can we apply this to the side bar itself?
I entered the CSS and it worked but the arrows in the menu didn't appear. Instead, I see light grey slivers you can barely see. How do I edit the icons (arrows/grey slivers) in the menu if the arrows didn't show up or if they aren't arrows after entering the code?
Great tutorial by the way and many thanks!
Did you get any answer? It happens the same to me.
Same here
Hi Lydia, in general if you can ask code related questions on our blog it would really help me out and you will get a better response. Thanks!
Great tutorial thank you
You’re welcome 😊
Great tutorial a lifesaver thank you. How would you do this though if you're using the Divi theme builder, it doesn't seem to work for that thanks!
What do you mean?
@@PeeAyeCreative it only works for the original menu not the theme builder menu.... and I know why because I use an vertical menu from you other tutorial
Is it possible to add a transition when opening the parent? So it doesn’t open instantly but more smoothly?
THANK U SO MUCH!
You're welcome!
Thanks as always dude ... Can you do a tutorial for the logo on menu???
Thanks Christian! What would you like to see about the logo?
That's a good idea, I'll see what I can do!
Amazing Tutorial, everything works perfectly fine!
But, do you have a solution for the parent menu items ? The child menu items only open, when I hit the toggle. When I click on the menu item (parent) itself, the menu just closes. Would be great if the child items would also open if you click on the parent item text.
Hope it’s understandable 😂
I had the same problem. Codes here helped fix it for me and menus working good on mobile now, for anyone else in the same situation. ruclips.net/video/3IQ-b2bEqyg/видео.html
Yea.. And the submenu should stay open, if i am on some submenu page.
Hi. How to make this work properly with gtranslate plugin? When i set gtranslate to show along with the menu, the gtranslate dropdown list wont show. Thanks
Thanks! Worked great.
You're welcome!
it worked but, how can the main item show the sub menu when click? because when I clicked the main item..it closes the dropdown
I used the snippets and it all works well. But is the menu item that now has collapsed sub menus is always bold and the little arrow next to it is green. I need to change both these things. I would like the menu item to not be bold and the colour of the icon to not be green. I cant find in the code where to change it
Excelente tutorial
Thank you, glad you like it!
How would you change the new submenu dropdown icon? The one with the green arrow. Is it custom code? Can't find directly in the theme builder
That's an ETModules icon (the Divi font family) and the icon is in the CSS code, so you can easily change it there.
Awesome! Thanks
You're welcome!
How can i make the submenu expand on mobile by pressing on a menu item with a custom link of # instead of pressing the icon??
Same question here - I have a customer that does not like the icon expansion and wants the submenu to expand when you click on the top menu item. Thanks in advance
@@ericjunge I have found a trick solution for this myself. Not sure if it’s the right way to do it, but it works. I’ll post it here later today.
Thank you!!!!!!!
You're welcome Scott!
it worked, thanks
You're welcome!
finally a good tut
I'm glad you like it!
Thank you so much !
You're welcome!
Hello, good day, I wanted to comment, I used the code and it works perfectly, except for a small problem, the menu appears only on the pages but it does not appear on the posts, I am using the divi constructor to apply a sidebar in all the posts, I don’t know if that’s the problem, but before adding the code that didn’t happen, any solution, thank you very much
Thank you soo much, Sir.
Actually I am having same issue what Elementor. When I refresh or load any page, the dropdown menu expends for a sec, and collapse automatically. I tried many things but couldn't fixed. Will this work with Elementor?
I don't know about other builders but I'm sure a similar principle would work although with different selectors.
Thank you sooooooo much
You're welcome!
How can i slide-in my hanburguer menu in desktop for divi with css
Thanks! Worked fine and helped a lot...but :-) I've got two (not one) little down arrows...tested it on serveral installations. Do you have any idea why? Thx
because there is a missing \ means it should be \33 or \4d instead of 4d for example
@@BennyHozjan Thx!
Yeah that is a common bug with pasting code into Divi.
When i changed content: '32'; to \32, and content: '33'; to \33 it fixed for both directions tnxx
just awesome!
Glad you think so!
thanks you so much !
You're welcome!
i tried this and it works. the problem here is that when you click the entire row with dropdown other that the icon, it closes. any ide why?
Thank you
You're welcome
Hello very good tutorial thank you man:)
i try to fix that code to my site from right to left letters... and its getting big mess// the arrows are on the letters on the right side.
how can i fix the arrows to be on the left side? is there an easy way for that in divi?
I got it fixed some css tnx
Hi Benny, glad to hear you got it.
ESPECTACULAR
I'm glad you like!
how to use the Et module font ? to change the signs to + -
please
You can use any of them here: www.elegantthemes.com/blog/resources/elegant-icon-font
@@PeeAyeCreative my menu is collasping but the icon is not showing . just a white circle . could you please help me ?
and when i try to upload the fonts , they arent premitting because of the security reasons
ugh i wish divi had an option to change header format based on device
thank you!
You're welcome!
worked thanks
You're welcome!
I really need your help, sir. I did use your snippet and everything was working well until a few days ago the mobile menu and logo stop showing. I have tried all I can to make it to work but I can not do it. Can you please help me with a fix to it. The menu is working well on pc but not on mobile.
I'm guess the issue is related to the recent WordPress 5.6 update. Be sure to update Divi and report any bugs to Elegant Themes.
@@PeeAyeCreative ok sir. I will check right a way for an update
it worked but mine is shoeing 2 drop icon instead of 1 ..something like this vv instead of just v
Okay did you check if Divi is stripping out the \ forward slash in the code? You can see about that in the blog comments.
Hi, is there a way to make the parent link, clickable too? thanks!
It already is clickable, I have not altered that in this tutorial.
@@PeeAyeCreative thanks, but I'm confused it's not working on me.
I mean instead of just clicking on the icon on the left, I can also click on the label of the parent link, then it should do dropdown the submenu.
Merci je viens de faire parfait
You're welcome!
Thanks, buddy. It's helpful for me
You're welcome, I'm glad it is helpful!
doesnt work on my site.
merci !!!!!!!!!!!!!!
You're welcome!
What is collapse minu mean
Check the video and you will see! 🙂
¿por qué me sale el título del vídeo y descripción en español, si el vídeo es de un inglés de habla inglesa? youtube es un puto troll...
damn as a developer - this solution sucks. I get its meant for common folk and it works well in that use case. This clearly is a blind spot for divi.
I'm not sure how this solution would differ for developers vs common folks. It's also not a blind spot, they are fully aware of these things.
@@PeeAyeCreativegood devs are going to write a child theme function or a plugin extension to cover this and likely would avoid using jQuery or recommend that the client uses native Gutenberg instead. A good dev isn't going to inject code into the browser even if its just css. You can be aware of a problem and not care about correcting it and that is a blind spot. Hope that helps!
Your statements are very odd, and quite frankly, wrong. A developer would certainly not do what you said. I'm not sure where your comment is coming from, but it's really strange.
@@PeeAyeCreative lol suggested use of Gutenberg which has been native to WordPress for a number of years now is a strange comment? 🤔 Got it.
great tutorial. thank you
You're welcome!