Select Page

Divi WordPress theme has this header and menu combo which fits nice with a modern website design. Interestingly you can change it’s color with the color picker (Duh!)

But more interestingly, the color picker has an option to choose alpha values AKA transparency into the menu.

This opens up the opportunity to make glass like effects with the Divi theme menu/header.

It works even better when you have a scrolling navigation menu.

A nice little trick I love is when I set the transparency of the header menu combo to zero, meaning there is no color at all and the menu is invisible but the links and logos are still visible.

This allows me to add an image in background and this looks preety nice with a combination of a darker background.

I made a video tutorial describing how you can make the Divi header navigation transparent, please have a look at it:

If you find this trick neat, you should also consider checking out these other Divi header tutorial playlist which will help you further customize your website.

There is a flaw to this trick.

For example if you set a white background and color to your header menu links, it may look nice with a background layout but in pages or blog posts, the menu goes hidden with a lack of a background. I am trying to figure out a solution, maybe you can help me out with one. What you think? Please let me know in the comments.

Pin It on Pinterest