Site logo

Archived topic

Page Hero Layout - Block Element

15 replies · Started by Andy on June 12, 2022

Viewing posts 1–15 of 16

Hi,
I'm trying to create a 2 column page header using the Block Element and the page hero element type to replace my existing full-width single column page header element.

However, I have a couple of issues:
- I want to display an excerpt from the post below the post title. I've tried using the Dynamic Content block and the post excerpt type but this adds a read more link after the excerpt. How do I remove/disabled this?
- My existing header used the 'merge' option so that it sat behind the navigation area. Is there any way to achieve this with the block element?
- Also, I need the 2 columns to be full-width, I can't see a way to do this with the grid block

Thanks.

Hi Leo,
I've added URLs to the private field. I managed to figure out the full-width 2 column layout, see URL 1.
However I'd like the columns merged behind the header as in URL 3. Also, now that I've added an excerpt to the post its displaying this on the archive page too, see URL 2. I have the excerpt word count set to zero in the customizer settings but this doesn't seem to be working. Also still need the read more link removing from below the excerpt (URL 1).

Hope that all makes sense and thanks for the assistance.

Thank you for this, I've now got the merged header working. However, still struggling to remove the read more link from URL 1.
Yes, its using a custom excerpt in the post editor and the post format is set 'standard'.

Still also need to remove the excerpt from the archive page, see URL 2.

Thanks.

Also, I may have discovered a bug. When editing the Page Hero Block I am trying to add a custom class to the Grid Container Block (the 2nd column) but it doesn't render it in the html. And also if I click on a different block and then return to the Grid Container Block. the class has not saved under the advanced tab.

Hi Andy,

With regards to the read more button, you can add remove-readmore to the classes of the Container Block under the Grid Block which holds the excerpt as such: https://share.getcloudapp.com/z8umZ2QG

Then, add this CSS in Appearance > Customize > Additional CSS:

.gb-container.remove-readmore .dynamic-entry-excerpt .read-more {
    display:none;
}

If its not adding the class isn’t appearing, can you try to clear all caching mechanisms set on your website? Also, does this occur on just Container Blocks within Grid Blocks? If you try adding a class to a different GB Block, does it work?

Also, there seems to be no excerpt in link 2 on my end: https://share.getcloudapp.com/2NumyZ6z

Are you seeing the same Page-Hero in this link?

Kindly let us know.

ok I'll try the CSS approach.

Regarding the excerpt on URL 2, its showing below the first post/thumbnail on that page, you need to scroll down below the page hero to see it.

Do you mean this excerpt?
https://www.screencast.com/t/8s3vSbAlb

Since you are using a custom excerpt for this post, it will show the custom excerpt regardless of what the word count is set to.

Solution: Remove the custom excerpt for that post.

Yes thats the one. I'm going to start using the custom excerpt in the page hero on each single post but don't want it shown on the archive page.

Thank you thats great, I've now built the layout and put the URL in the private field below. Is there a way to make the whole thumbnail/container link through to the post without upgrading to GenerateBlocks Pro?

Yes, you can give this CSS a try:

.category .dynamic-content-template a:after {
    content: "";
    position: absolute;
    top: -80px;
    left: 0;
    right: 0;
    bottom: -80px;
}

Thank you for this, it works, but the gold stars are not clickable for some reason?

Also, on the single post (see URL in private field) I'm using the shapes block to create a yellow triangle between the hero section and post content. However, it also creates a yellow strip/border below the triangle, Ideally I want that line reduced to just a 1px border.
Is that possible?

Thank you for this, it works, but the gold stars are not clickable for some reason?

When you are using a container link, the link will be on top of everything, when you click on the container, you are clicking the container link. Does that make sense?

Ideally I want that line reduced to just a 1px border.
Is that possible?

No, you'll need to edit the shape in illustrator, and to use a customized shape, you'll need to install GB pro.

This archived topic is closed to new replies.