What are GeneratePress Elements?

GeneratePress Elements are things that you can apply to more than one page or post.

For instance, you could use GeneratePress elements to…

  • Add a call to action box that you apply to all posts in a category.
  • Make a footer that you apply to pages but not posts.
  • Build a hero header with background image that you apply your contact us and about us pages.
  • You could use a hook element to add Google Analytics code to your website.

GeneratePress Elements are very powerful and very useful.

If you only learn how to use one GeneratePress Element, make it the block element.

Check out the block element!

The four GeneratePress elements are header, hook, layout and block. One thing all elements have in common is display rules.

Display rules enable you to control which specific pages, posts and archive pages will be affected by that specific element. For instance, you could create a hero header element. Then via the display rules tab choose all posts. Now that hero header will only display on posts, it will not display on pages or archive pages.

Although the block element does not have a tab labeled display rules, it does have all of the display rules settings.

Display rules can be broad or specific, you can create very detailed display rules if you need to.

In the screenshot below, I target all posts in the food category, except the post called alcohol free drinks for special occasions.

GeneratePress Element display rules.
Use the display rules tab to control which posts or pages will display your GeneratePress element.

Be careful not to let your display rules conflict.

In version 1.11.0 there are four GeneratePress element types…

  • Header
  • Hook
  • Layout
  • Block

What should you use each of the GeneratePress Elements for?

To help you get started, I’ll tell you some of the reasons I use the different elements.

There are four GeneratePress Elements

The Header Element

I use the header element to add a simple hero header to all posts in a specific category. Then I can use template tags to automatically insert the post title, post author and taxonomy into the header for each individual post. I can also make each post’s featured image display as a background image for that specific post’s header.

The Hook Element

If I need to run a script, execute PHP or display the content of a shortcode outside of the post content area, I use the hook element. Hooks are a bit more advanced than the other GenerateBlocks elements.

The Page Layout Element

The page layout element enables me to show or hide different page elements on a post by post basis. For instance if I want to display sidebars on most of my blog posts, but on this specific post I want to hide the sidebar, I can.

Using the page layout element I can show or hide the sidebar or footer. I can also set the page content width and toggle on or off eight specific page elements. Such as the content title, featured image and navigation bar.

The Block Element

The block element lets you use GenerateBlocks plugin to build a layout and then hook that layout into your site. GenerateBlocks is a WYSIWYG editor that enables you to build great looking layouts fast and without needing code. For instance you could build a call to action box and then hook that call to action below the content area on all posts in a specific category.

The block element is easy to use, powerful and very useful. If you only learn how to use one GeneratePress Element, make it the block element.