Page Headers in GeneratePress

A GeneratePress Page header is a large hero header section at the top of the page or post.

Page Header or Hero Header in GeneratePress
Page Header or Hero Header in GeneratePress

In the WordPress Dashboard select…

  • Page Headers > Add New
Adding a new page header in GeneratePress
Adding a new page header in GeneratePress

Next select the Content tab and choose from the many options.

The Content tab in the New Page Header dialogue box in GeneratePress
The Content tab in the New Page Header dialogue box in GeneratePress

There are many options available in just the content tab alone. You also have Image, Background video, Logo and Advanced tabs to experiment with.

The best way to learn how to use these different settings is to simply experiment and see how the different options change the way your page header looks.

Your page header can have a background image or a background colour.

You can also add a coloured overlay to a background image. A coloured overlay can make text you place over the background image easier to read.

With page headers you can…

  • Add hero header sections to any page or post.
  • You can also add these headers to the top of archive, category, tag and blog listing pages.
  • You can style these headers individually or use the global setting to style all posts or all pages in a similar way, it’s up to you.
  • Page headers with large hero header images are the height of fashion, and with GeneratePress they’re easy to add to your site.

You can also merge the header image with the header logo and navbar area. So your website’s logo and top navigation backgrounds become transparent and sit inside the header image.

PHP Template tags for GeneratePress Page Headers

There are five basic PHP template tags that can automatically draw things like the post title into your page header.

These tags are not very complicated to use and full instructions are provided in the GeneratePress documentation.

PHP Template tags for GeneratePress
PHP Template tags for GeneratePress

Page Header Global Locations

You can select which page header to use as you make each individual post and page.

When you write a new blog post or make a new WordPress page…

  • Look under the post editor for the Layout tab
  • Click the Page Header tab
  • Choose one of your page headers from the drop down list

Obviously, you must make at least one page header before you can do this.

Selecting page headers on a post by post basis
Selecting page headers on a post by post basis

 

Or you can use the Global Locations option to automatically insert one of your page headers in any of these locations…

Setting Global Locations for page headers in GeneratePress
Setting Global Locations for page headers in GeneratePress