Like our free content? Then you'll love our exclusive Club!
Divi Academy Membership gives you exclusive access to over 110 resources, including child themes, layouts, cheatsheets, tutorials, live training and member perks. And new content is added EVERY Monday!
A Better Divi Main Menu Free Divi Layout.
This free Divi resource restyles the default main menu to a customised non-Divi look. It includes both customiser and theme options .json files to import, with all the CSS and and JS automatically added to your theme options dashboard.
View the demo and download this free layout plus 24 other awesome free Divi resources by subscribing below.
Be sure to view the ‘Read Me’ file in the download package for full instructions.
If you found this helpful please leave a comment and subscribe to my newsletter for all my latest Divi related content.
Michelle X
Hi Michelle, I really like this menu. Having trouble changing the logo. I replaced the .SVG file with a PNG but it won’t change it’s size like your original logo. then I tried an SVG format but WordPress tells me it can’t add it because it’s insecure. Any ideas? Thank you for your help!
You can add this to your functions.php file to enable SVG upload.
//Allow svg uploads
function allow_svgimg_types($mimes) {
$mimes['svg'] = 'image/svg+xml';
return $mimes;
}
add_filter('upload_mimes', 'allow_svgimg_types');
HI Michelle, I have a question, I want to know if possible change the circe of the header because my logo isn’t circular it is rectangular
Thanks
In this section of CSS, just remove the border radius:
.et_menu_container::before {
content: '';
border-bottom-left-radius: 90px;
border-bottom-right-radius: 90px;
background: rgba(255,255,255,.8);
position: absolute;
top: 100%;
-webkit-transition: all .7s ease;
transition: all .7s ease;
}
How to change the coffee color of the menu?
You can change colours in the theme customiser
This is great, thanks! The mobile ipad view (using chrome inspector) has a bug on the site I’m working on https://skylinedetectiveagency.com/place-order/. The primary menu and logo are to large for the ipad. Could someone help me fix the issue?
You can use this method to adjust logo size https://divisoup.com/quick-snack-make-the-logo-bigger-on-mobiles-and-tablets/
Hi Michelle,
First many thanks for so fantastic job.
I installed this amazing menu and all ok in desktop.
In moible devices I’m using a plugin menu and by that I would like to use your menu only in Pc .
Is it possible? I think so but I don’t know which part of code of json file imported to divi option I have to delete.
I hope you understand what I want to do.
Have a good day
Cheers.
You can just hide the menu with CSS using media queries
i am getting those arrows when my menu is a sub menu please help how can i solve that i used the divi better menu from the freebies pack
Can you provide a link to where that is happening?
Hi Shay. I think he means something like can.perakoda.com (see the real estate menu)
Thank you for this! I am new to divi and installed it to test it out and expand my knowledge, How do I go about uninstalling both the json files?
You can’t uninstall theme and customiser settings, you will need to export those settings from a fresh install using the portability feature and import them into your existing site.
What files I need to refresh?
I don’t understand your question.
Hello Michelle, very nice menu. Thanks
Hi. Which of the zipped files contain the header?
This freebie includes a menu layout, not a header.
Hi Michelle!
I love the look of this menu. You get so tired of the regular Divi look. I’m having an issue with the hover however where the border is disappearing on the one side adjacent to the active page. Can you help me debug this? Thanks!
-Catherine
http://suewalkerpa13.com/index.php/home2/
I don’t see that happening on my end.