One option our Page Header add-on has is the ability to merge your header & navigation with your page header content.
This works great if you’re using the Page Header add-on to add content, but doesn’t help if you’re using a page builder like Elementor or Beaver Builder to build your page and need to achieve the same effect.
Luckily, we can still use the Page Header to achieve this look, even without using the content area in the add-on.
Create a Page Header
The first thing we need to do is create a new Page Header. Go to Pages Headers > Add New and give your Page Header a name.
Enabling content options in the Page Header
Even though we’re not using the content area in the Page Header, we still need to enable all of the options that come with adding content. We can do this by adding an HTML comment into the content textarea like this:
<!-- page header -->
Note: Your Content settings should look exactly like the above. The only two things you need to do is add the empty element and set the container type to full width – nothing else.
Setting the container type
Now we want to set the Container type option (shown in the screenshot above) to Full Width.
Merging our header
Now navigate into the Advanced tab, and enable the merging of the header and your content.
The key here is the Place content behind header (sliders etc..) option. This is what will place our header on top of our page we’ve built using our favorite page builder.Then of course you can style your site title and navigation to look good with the design of your page.
Now publish your Page Header.
Applying it
Now that we have our Page Header built, we need to apply it to our pages. We can choose between applying it globally to all of our pages, or applying it to single pages.
To apply it to all of our pages globally, go to Pages Headers > Global Locations and use the dropdown next to Pages to choose our newly created Page Header.
We can also choose to apply it to a single page. We just need to edit that specific page, and choose our Page Header to display.
