How to create custom header in WordPress with Divi Builder

WordPress’s default header is so boring that no one likes it. Every designer, developer, and blogger wants to look their header cool and easily accessible as that is the most first thing a visitor sees on a website.

Therefore today I will show you how to create custom header in WordPress without writing a single line of code using Divi builder.

What is header in wordpress?

When creating a website, header is one of the most visible parts you need to notice. Because if the header is more attractive then your website is more appealing as well in the visitor’s eyes. With Divi Builder, you can create an awesome looking header for your website without having to deal with CSS or HTML instead and without writing a single line of code.

Global header means a common top navigation bar which appears on the entire site. It is the most integral part of a theme. A theme is the overall look of your site which controls the header, footer, and common body area. A header can consist of your website logo, navigation bar, search box, social icons, cart icon, email id, and phone number.

In old days header was limited to just the logo and navigation menu. But as the web world revolutionized then more theme developers dived into this field and they created more advanced and highly interactive themes which let the non-techy people to customize or say design the design however they want and that was too without writing any single line of code.

One of them is the elegant themes who created this awesome theme called Divi which comes with WordPress’s one of the most popular page builder called Divi Builder. Therefore, let us check how do we create custom header in WordPress with this divi builder and how do we assign or add it globally on the entire site.

How do I create custom header in wordpress with Divi’s theme builder?

The following video tells you how to create a custom global header in WordPress with divi builder for the entire site. Just to remind you in case you haven’t known yet divi builder can now be installed on all WordPress themes, not limited to themes developed by Elegant Themes (the developer of divi builder) anymore. They have launched the divi builder as a standalone builder as well which could be used on any WordPress site running any theme.

Please also check How To Fix WordPress wp admin page not found error

Method 1 – Video: how to create custom header in wordpress.

Before

divi default header

After

after create custom header

Method 2 – Text: how to create custom header in wordpress.

  • First, login to your WordPress dashboard and go to Divi -> Theme Builder from the left sidebar menu. Click Add Global Header and select Build Global Header.
theme builder header
  • Now there is are two options to create custom global header:
  1. Build global header
  2. Add from Library

Build global header option is used for creating custom global header from scratch and with the help of second option add from library we can insert header from the divi library. Divi library is collection of your saved elements. Suppose you are designing or creating something in divi builder and you think you have created a nice section which you think can be used on other pages or posts as well. Therefore you can save that section into your divi library and then you can import that section into other pages or posts by using the Add From Library option on that page.

But right now we choose build global header option.

create builder global header
  • Once you are done editing your layout or custom global header, click the Save button in the bottom right corner to apply the latest changes and click the button on the top-right corner to exit the Divi Builder.
save custom header
  • Now you will be taken back to the Theme Builder page and here you have to click on the Save Changes button as shown in the following screenshot.
save all changes

In this tutorial, you learnt that how to create custom global header in WordPress using Divi’s Theme Builder with an easy step-by-step way.

I hope that you liked the tutorial and now you can also setup your custom global header with divi’s theme builder. Also If you have any type of question or suggestions, make sure you leave a comment in the comment section below.

Checkout huge collection of ready made divi templates here.

1 thought on “How to create custom header in WordPress with Divi Builder”

Leave a Comment