Archived topic
Header Element Not Showing Properly On Blog Page
5 replies · Started by Gilad Gafni on February 9, 2022
I have a Header Element with Featured Image as a background and {{post_title}} inside of it.
This header works perfectly with the exception of the Blog page.
On the Blog page, the word "Blog" shows up in place of {{post_title}} and a second inline .page-hero style appears and overrides the background image.
.page-hero {
background-image: linear-gradient(rgba(17,24,39,0.27), rgba(17,24,39,0.27)), URL();
}I tried a dedicated Header with Background Image but got the same results.
PS. This is the page - https://www.bigbenlawyers.com/blog/
Any idea how I can fix the title and remove the extra style?
Hi Gilad,
Are you using the same header element for pages and blog?
You can upload a fallback background image to the header element, it will appear on the pages that don't have featured images and archive pages including blog.
Let me know if this helps :)
I tried 2 ways -
1. Same header with Featured Image as a background
2. Blog only header with Custom Image as a background
Both got me the same result. The hero image gets covered by a solid background color.
Hum... there's a weird CSS inserted to your blog page:
https://www.screencast.com/t/R300C275xOK
If you go to the blog page, how many elements are indicated in the admin bar?
https://www.screencast.com/t/7u8OK5G7WV
And what are they? Let me know!
That's the strange part. There are 2 x .page-hero CSS selectors and they override each other.
There are 7 elements on that page.
6 x Hooks
1 x Header
Hi Gilad,
Can you check for any code snippets or Hook elements that uses wp_footer hook?
This extra page-hero CSS seems to be hooked within this hook I've mentioned.
If you need help in skimming through the site for this, you can provide us temporary backend access so we can check things w/ you.
You can use the private information text field to provide the details -
https://docs.generatepress.com/article/using-the-premium-support-forum/#private-information
