Select Page

Changing your hamburger menu colour in Divi WordPress

I often came across this little problem – I want my menu bar to be the same colour as my high light colour in Divi.

This problem will arise when you set your Menu Bar to be the same colour as the Highlight for links in Divi. If you want a dark header and a dark link color you will find it occurs.

Simple Way to Adjust the Divi Theme Menu Color

Using a CSS Snippet is the easiest way to adjust the color and get your desired result.

You can add this snippet to your Divi Theme.

In WordPress go to your Divi -> Theme Options Menu Item.

After selecting the menu you are on the options page for Divi Theme so scroll down to the “Custom CSS” area. Its the last box on the page.

Copy the Below snippet or get it directly from GIST.

Paste this snippet into your Custom CSS area. Make sure to change the color to the color you want.

This will need to be a HEX value, which is used in CSS so if you don’t know what that is, you should probably Google It.

If you need a more in depth review – please watch the screen cast video.

Do you need more simple tips and helpful tools for your Divi Theme website?

Register for free and get the most out of your Divi Theme with our training and materials.

Tweak of the Week – How to clear the Local Storage

When you are editing Divi Websites you need to be able to clear local storage whenever you update your divi modules.

This is especially true for any of the updates we do here with our modules at Divi Framework.

Watch the tweak of the week screencast to work out how to clear the local storage and save lots of pain in Divi Module Updates.

What is Local Storage?

Local storage is a way your browser stores information. As a web developer the only way we originally could do this was with a cookie or a static asset. Now that we have HTML5 we have the ability to store data locally in your browser.

This is really useful for web-apps because database style information can be stored in your browser.

How does Divi Theme use the Local Storage?

The Divi Builder is the area of Divi Theme that makes heavy use of the local storage. Local storage is used specifically for storing a list of module types, the version of Divi Builder and the great copy and paste features we all have grown to love.

This love sometimes turns into pain when we get nagged to update the Divi Builder and clear the browser cache. By using this command for clearing the local storage you can ensure you rid yourself of these nags without having to clear your entire browser cache.

In Chrome you open your developer tools. You can do this by using the Chrome Menu at the top-right of your browser window,then select More Tools > Developer Tools. You can also use a shortcut of ctrl + shift + i in windows.

Once you have the developer tools open select the console tab and type into the console your local storage clear command.

localStorage.clear()

This will clear out all those stored values.

How can I see the stored values?

You can select the Application Tab. In hear you have a number of options to view Local Storage, Session Storage, Cache storage and more.

You also have a short cut key in here to clear the storage and check service workers.

These are all essential to Progressive Web Apps and the new breed of HTML Applications.

To learn more about this take a look at the official documentation.

Are you a member of Divi Framework?

Get a great bunch of free tools for your Divi powered WordPress site. Signup for FREE as a member at Divi Framework.

Having Multiple colours in your submenu with Divi

In this screen cast I will cover a quick and simple tweak for having multiple colours inside your Divi Submenu items from the Main Menu.

This is a really effective tweak for making each section different than the other and to create a bit of a distinct look and feel. This works really well for Product based websites.

The CSS snippet in the Screencast can be found here

Or you can copy it from the GIST below.

Hope you guys enjoy this tweak of the week and look forward to the next one.

You can subscribe to my youtube channel so you are notified each time a new tweak is released.

 

Divi Framework - build anything with Divi to create your online business.

30 day money back guarantee

Safe & Secure online payment

Support team & documentation