[Support request] What method for different heros for different pages

[Ben]

Hi,

I’m a bit confused on what option to chose, so please help me out.
I want to create a website with, say 6 different pages. All pages should have the same hero/header design but the content of the hero should vary on each page. It should show the page title/a headline and some introductory text/a teaser.

How do I best do this? Is there a way to make the layout just once, so I don’t have to build the layout 6 times for each page? And when I change the layout once it will apply to all 6 pages (with the different contents)?

As far as I understand, this is not possible, but I will have to build it 6 times (ok i can copy/paste, sure). But then do I use the header element and create 6 of them and apply the location rules — or do I use the block element, type hero (or header?), and apply location rules.
Or is there a third way?

I did read the documentation and watch the videos on the elements but I’m still confused.

Thank you.

[Ying]

Hi Ben,

If you want to use only one block element – page hero and apply it to the 6 pages, you will need to create custom fields for the headline and some introductory text/a teaser.

Here’s an instruction from WP on how to create custom fields: https://wordpress.org/documentation/article/assign-custom-fields/

Then you can use the Headline block of GenerateBlocks plugin to pull the custom fields data dynamically.

As the block element – page hero is a GP element, you can either use the GP element’s dynamic data feature, or use the GeneratBlocks’ dynamic data feature.

Both would work.

Here’s a video tutorial on how to use the custom fields data using GP’s block element’s dynamic data feature: https://youtube.com/watch?v=Ff7ikQ7Yw0w&si=EnSIkaIECMiOmarE

[Ben]

Thank you, Ying, for your quick, good answer.

I enabled custom fields in the editor and created one with the name “page quote”. Then, in the editor on the same page, I inserted a GenerateBlocks Headline block and enabled Dynamic Data. I can only choose post and author variables there, but not the custom field I created, also after a refresh.
What am I doing wrong?

—
And IF after all I end up making 6 page heros manually – do I use the header element or the block element, type header? I don’t really get the difference in use cases for the two.

[Ying]

Hi Ben,

The custom fields will not show in the dropdown list, you will need to manually enter it.
Please refer to this video: https://youtube.com/watch?v=Ff7ikQ7Yw0w&si=EnSIkaIECMiOmarE

Starting from 1:41, it shows how to pull the data from the custom field.

And IF after all I end up making 6 page heros manually – do I use the header element or the block element, type header? I don’t really get the difference in use cases for the two.

You do NOT need to create 6 page heros, you only need to create one block element – page hero: https://docs.generatepress.com/article/block-element-page-hero/
Please watch the video in the above documentation for a better understanding!

[Ben]

Thank you! I can choose the custom field if I select ‘post meta’, perfect.

You do NOT need to create 6 page heros, you only need to create one block element – page hero: https://docs.generatepress.com/article/block-element-page-hero/
Please watch the video in the above documentation for a better understanding!

Ok yes, I can use dynamic image and custom fields to customize the one block element – page hero I create. But if I want to further customize the hero section on each page, then I create 6 page heros (block element) rather than 6 header elements or?
Can you explain or point me to somewhere to get the difference between block element-page hero and header element? I read the documentation and watched the videos, but I don’t get it.

Thank you!

[David]

Hi there,

But if I want to further customize the hero section on each page, then I create 6 page heros (block element) rather than 6 header elements or?

If you want to add static content inside the different heros, then yes you would need a separate element for each of them.

Big differences between the Block Element and the Header Element are many.

Header Elements are old school and require HTML and have limited options. But they can do one thing that Block Element cannot currently and that is Merge the Site Header with the Content. And you can use this in tandem with a Block Element.

For modern builds use the Block Element

[Ben]

Thank you, that helped. It would be nice to have that in the documentation.

But they can do one thing that Block Element cannot currently and that is Merge the Site Header with the Content.

Is that planned to change anytime soon? The block element seems so much more convenient, but merging header and content is a common use case.

[David]

Yeah, we are planning to a) update the elements to make them more user friendly with new docs, and b) the merge feature is something we are looking at making portable so it can be used in other elements.

Thanks for the feedback its much appreciated.

[Author]

Posts