Code by Day | Explore By Weekend

Custom Divi Header 03 – Free Download

In this post, I'm giving away our third free custom Divi header layout and CSS. Use this creative design to customize the Divi header on your website.
custom Divi header
custom divi header

Key Features

NOTE: Uses the Default Divi Header!

  • Unique Open Menu
  • Two Buttons Side By Side in Column
  • Play Icon with Hover Effects
  • Designated Column Stacking Order on Mobile
  • Menu CTA Button
  • Custom Slide-Out Mobile Menu

I spend a lot of time developing these FREE Divi resources. However, all I ask in return is that you subscribe to the blog. You won’t get spammed daily like some sites do (eh hem), but I will share helpful new tutorials and products once in a while when they come out.

NOTE: If you already subscribed for these before, no worries. You won’t have to confirm this time, just enter your info and the download link will appear.


Please share this Divi freebie!

Nelson Lee Miller (aka The Divi Teacher)

Nelson is the owner of Pee-Aye Creative Co in the beautiful state of Pennsylvania. He loves helping small businesses, exploring, building websites with Divi, and teaching others.

Join Our NEW Divi Facebook Group!

The Divi Teacher Logo

View More Divi Freebies

Leave A Response!

Notify of
Newest Most Voted
Inline Feedbacks
View all comments
2 years ago


2 years ago

Love this thank you, it makes the menu a lot better. I want to make the burger bar menu kick in earlier as I have lots of menu items. Not sure which bit of the code to change. I tried this but doesn’t work properly. Thank you once again.

@media (max-width: 1200px) {
nav#top-menu-nav {
display: none !important;

2 years ago


When I try to install the customizer settings I get an error saying i can only upload a json file and the file is css

2 years ago


I couldn’t upload the customizer settings because it’s in css format and to upload only JSON file is required.

2 years ago

Hi Nelson

Thank you for assisting me and providing us with cool divi layouts and tricks. However on this header I can’t seem to find a way to edit the button on the header, could you please assist me. Thank you.

2 years ago

Hi Nelson!

Thank you for sharing this amazing Header:)
Everything works very well.

Only thing I would like to ask your help is about video link in play button. I have a video on youtube that I linked to a play button and it’s opens youtube page or youtube page in new tab.

How can I make my video open in my website page like in the example provided below?

I would really appreciate your help!

1 year ago

Loving your work 🙂
2 questions if you can help? on my site …

1) The last menu item is styled with the rounded corner border (which i love) … how can i add another link after this? I want the rounded corner link to be called ‘MENUS’ and the next link to be called CONTACT? any thoughts

2) Currently, my site is showing the shopping cart icon at the end of the menu? i can’t seem to hide it? any ideas?



Managed to fix point 2 but still can’t work out where the to edit ‘lastchild’ or where/how to add a class to the menu option to get my menu right?

Asset 7

Shop Our Divi Products

Plugins • Courses • Templates

Visit The Shop

become partners with Pee Aye Creative

Partner With Us

We are looking for you!

Learn More

Divi Tutorials On YouTube

Join over 5,700 others and subscribe to our helpful Divi videos!

Visit Our Channel

Pin It on Pinterest


Your Cart