Welcome to Day 8 of our Divi 100 Marathon. Keep tuning in for 100 days in a row of awesome Divi resources as we count down to the amazing release of Divi 3.0 on the final day of the series!
Today we are happy to release our next Divi extension in the Divi 100 marathon. This extension, the Divi Hamburger Menu Styles Extension, adds twenty new hamburger menu styling options to Divi’s Fullscreen and Slide-in Header Formats.
The header is one of the areas we get the most community requests for customization so we’re excited to offer more unique styling options for those seeking it in their hamburger menus.
As you can see in the live demo below, the Divi Hamburger Menu Styles Extension comes with four new hamburger types, each with five unique animation styles. To test them out simply click each individual icon or the “toggle all” button to see them all animate at once.
Downloading & Using the Divi Hamburger Menu Styles Extension
As will continue to be the case with all of the extensions we release during the Divi 100 Marathon, the Divi Hamburger Menu Styles Extension comes in the form of a plugin. So to use it you’ll need to install it just as you would any other plugin.
Once you’ve downloaded the zipped file, locate the divi-100-hamburger-menu.zip file in your computer’s download folder. Next, login to your WordPress admin and navigate to Plugins > Add New. Click the “Upload Plugin” button at the top and upload the zipped file you’ve just downloaded. When prompted, click “Activate Plugin” to activate the extension.
You should now notice a new menu in your WordPress Admin’s sidebar called Divi 100. This is where all of the settings for Divi 100 extensions will appear. If you’ve already downloaded our first extension, The Article Card Plugin, you will simply have a new option within the Divi 100 sidebar menu called Hamburger Menu.
Click the “Hamburger Menu” option to open up this extension’s settings panel. Here you will find four settings you can configure. The hamburger menu type, animation style, default color, and active color.
Once you’ve finished configuring your settings you can click “Save Changes” and view them on the front end.
Plugin Updates & Bug Reporting
As will be the case with all of our Divi 100 extensions, bug reporting and updates have been made available via their respective github repositories. This is the best place for both us and you to track bugs, make fixes, and download new releases. You’re even able to clone, fork, or otherwise edit the code to your heart’s content.
We hope you have enjoyed this Divi 100 freebie and we look forward to providing new extension and code snippets every week for the remainder of the series. So be sure to subscribe to our email newsletter for notifications when new free resources are made available.
Divi 100 Day 8
The Countdown To Divi 3.0
This post is part of our Divi 100 marathon. Follow along as we post free Divi resources for 100 days in a row! This 100-day countdown will end with the game-changing release of Divi 3.0, including our brand new visual editor built from the ground up using React. Divi 3.0 will change the way you build websites with the Divi Builder forever!
Let the countdown begin.