[Resolved] Having Issues With Navigation & Page Hero Goals

[Marty]

Great, I have that. I still have a few things remaining: 1) Duplicate featured image, 2) header/hero is not merged with the body area, and 3) how to left-align the Header Text Area items? (H1, Author field, Date)

I assume I’ll need to individually disable the featured image element in posts/pages or in the Layout options?

Thanks!

[David]

You can use a Layout Element with the same display rules as your header element, to disable the Featured Image, Title etc.

https://docs.generatepress.com/article/layout-element-overview/

Can you share a link to a post where i can see the header element ?

[Marty]

Ah ok, thanks I’ll check that out. I’ve included an example link (I created a test page and set the display rule to this page for now)

[David]

1. The layout element should resolve the duplicates.

2. header/hero is not merged with the body area – this i don’t understand ? Can you explain.

3. Align left, in the Header Element you can set the Horizontal Alignment to left.
Then add this CSS to limit the width of its content, and align it:

.page-hero .inside-page-hero  {
    max-width: 840px;
    margin: auto;
}

[Marty]

Thank you – I think I’m good now. What I was referring to is a gap between the page hero and the top of the body container which I can change in Customizing ▸ Layout Container ▸ Separating Space. I misunderstood the Merge feature and now I’m clear.

Sincerely, thanks so much for your help! I’ve had several people purchase GeneratePress because I frequently recommend it to others for its awesome support and all the great features. 🙂

*(Note: Some documentation/examples like here: https://docs.generatepress.com/article/page-hero-examples/ are dead links so it’s harder to figure out the settings/etc.)

[David]

Glad to be of help and thanks for the kind words and feedback. Much appreciated.

Ill take a look at those deadlinks, see if we can fix that 🙂

[Marty]

My apology, yikes, I overlooked doing similar in a post w/sidebar rather than only a page w/ no sidebar.

Is it possible to left align the page hero contents with the body container, similar to my posts with no page hero? I have not been able to find a way. (Example link submitted)

Thank you so much again.

[David]

You can use some CSS like this:

@media(min-width: 1024px) {
    .right-sidebar .page-hero .inside-page-hero {
        max-width: 1160px !important;
    }
}

It will overwrite the max-width when there is aright-sidebar on the page.

[Marty]

Awesome, thanks again! That helped. I was then able to limit the H1 text length (have it wrap) within the same width as the body text as desired:

/* The page hero width allows the H1 text to extend past the body container width.
    To have it wrap similar to a post w/o a page hero, set the text max. width to the 
    same as the body text width */

.page-hero .inside-page-hero  h1{
    max-width: 788px;
}

[David]

Awesome – glad to hear you got it working 🙂

[Author]

Posts