One of the vital-used options of the Divi Theme Builder is including an international header for your web site, after which having the ability to override it with customized headers anyplace you want. You’ll customise every web page, submit sort, and visual house of your website for your wishes. On occasion, then again, chances are you’ll no longer want a header on particular pages, whether or not it’s international or customized. On this article, we’re going to stroll you thru probably the most ways in which you’ll cover your header on the ones particular pages by means of the use of the Divi Theme Builder in order that your website can also be precisely what you want all the time and all over. Let’s dig in.
The way to Conceal Your Header on Explicit Pages
Very first thing, you’re going to wish to head to the Divi Theme Builder. To your WordPress admin dashboard, in finding the Divi access and input the Theme Builder subsection.
Create a World Header
If that is your first time the use of the Theme Builder, you want to set an international header. One of the best ways to do that is to make use of a freebie download that we offer by means of grabbing a header/footer JSON record from a blog post. Then use the Portability choices within the builder to import it.
Your World templates must now be set.
Assign Customized or World Header
The Divi Theme Builder has plenty of context menus that you’ll make the most of. The primary approach of to cover your header on a particular web page in Divi is finished thru this kind of menus.
First, you want to have the a template set that makes use of a Customized or World Header this is no longer a part of the Default World Template.
Subsequent, you want so as to add the particular pages on which you wish to have the header hidden. Achieve this my soaring over the template, clicking the Equipment icon (or right-clicking and deciding on Arrange Template Assignments). It is very important right-click within the template house, no longer the real header format to get those choices. Proper-clicking the header format offers other context instructions, as you’re going to see under.
To find the web page (or pages) that you wish to have sans header, and test the containers close to them. Anything else that you just assign to this template will not display the header at the entrance finish of the web site.
Use Context Menu Instructions
Subsequent, right-click the Customized Header or World Header. Choose the choice that reads Conceal on Entrance Finish.
Now, you must see the eye icon to the fitting of that format greyed out with a line thru it. This means that the header is hidden for any pages or posts which are assigned to this actual template.
You’ll additionally merely left-click the attention icon to toggle the visibility of the header (or frame or footer, too) off and on. Both method will paintings, and both method you’ll be able to cover the header on particular pages. Once more, simply remember to’ve assigned the particular pages you wish to have to cover this header on.
We might additionally like to notice that not like excluding posts and pages from templates, the use of the Conceal on Entrance Finish possibility this does no longer default a Customized Header again to the World. No header will display up in any respect at the assigned pages and posts.
Trade Approach
This system will simplest paintings when you don’t use a World Header as a part of your website’s design. Should you intend to make use of Customized Headers for various templates, you’ll use this solution to cover the header in Divi.
With that mentioned, you do wish to get started out by means of making a World Header format. Throughout the Divi Builder, create an empty Segment (that means no rows or modules contained inside). Then, move into the Segment Settings and into the Complicated Tab.
Subsequent, move into the Customized CSS choices and in finding the Primary Component box. Click on inside of and upload show:none; to the textual content field. What this CSS snippet does is take away this segment from the format, fighting the browser from rendering it and saving its area within the template. There are two causes we’re making use of show:none; to the segment as an alternative of simply leaving it empty with out a row or module.
- Since the browser would nonetheless render the segment area if it had been clean. It might be empty at the entrance finish of your web site, too. By way of the use of show:none; we’re disposing of it completely.
- If we had been to easily don’t have any World Header assigned in any respect, the default Divi theme header would display on pages that weren’t assigned or excluded from layouts with a Customized Header. Which received’t paintings for this system.
So if you’ve implemented the Customized CSS for your World Header’s unmarried segment, save your adjustments and return to the primary web page of the theme builder.
Exclude Pages from Customized Templates
As we discussed above, when you exclude a submit or web page from a Divi Theme Builder template, it reverts again to the Default Website online Template. If there are World layouts there, the ones will show at the front-end. If there are empty areas, the default Divi layouts will show.
By way of telling the World Header to make use of show:none; within the earlier step, you’ll cover the header on any particular pages or posts that you just exclude from a template.
Simply as within the approach above, you wish to have to both click on the Equipment Icon or right-click the template and make a choice Arrange Template Assignments. Then, navigate to the Exclude From tab, make a selection the particular pages or posts you wish to have to exclude, and mark the checkboxes for them. This time, the checkmark shall be crimson. When stored, the template will display an Exclude From line on the backside.
Apart from a submit or web page from the template that makes use of a Customized Header will revert it again to the World Header within the Default Website online Template. On the other hand, since you’ve gotten used show:none; CSS at the simplest part within the World Header, you’ve gotten successfully hidden the header on the ones particular pages and posts.
Once more, this system simplest works when you’re the use of Customized Headers for the theme builder templates and no longer an general World Header.
Wrapping Up
There are a large number of causes to cover the header within the Divi Theme Builder, and it’s extremely simple to perform the duty. Whether or not you employ a complete website of customized headers and wish to exclude a couple of from having one thru customized CSS trickery, or if you want to make use of the integrated Conceal on Entrance Finish command to take away all lines of any header, it simply takes a couple of clicks.
Why do you want to cover your header on particular Divi pages?
Article featured symbol by means of Nicoleta Ionescu/ shutterstock.com
The submit How to Hide Your Header on Specific Pages Using the Divi Theme Builder seemed first on Elegant Themes Blog.
0 Comments