- This topic has 7 replies, 3 voices, and was last updated 3 years, 7 months ago by David.
October 20, 2018 at 8:25 am #705933Tina
I decided to start moving my page headers over to elements.
I found I couldn’t replicate my home page header the same in elements. It had originally used the shortcode from lightweight grid columns to get it to layout the way I wanted.
So, I decided just to take the lazy way out and use your third example for heroes in the documentation and change my design slightly to accommodate. It looks ok.
But, using the CSS for grids has changed the way another hero element looks (my blog page header, which I converted across first a week ago).
So, how can I get my blog header just to look normal (text centre page)? I’ve tried playing with the CSS and created a CSS style “blog-hero-content” but nothing I’ve tried so far has worked to override the .inside-page-hero settings.
I guess what I need to do is merge both grid areas for the blog header element?
I’m not familiar with CSS for grids so I’d be grateful for any help.GeneratePress 2.1.4GP Premium 1.7.2October 20, 2018 at 2:59 pm #706085LeoStaffCustomer Support
Not quite sure what you mean?
Can you show me exactly what you are trying to achieve?
The third example is quite specific and will only work if you have a background image that is focused on one side like in the example.
Let me know 🙂October 20, 2018 at 7:43 pm #706181Tina
So, by that do you mean that you can’t produce any other type of hero element design once you use the third example?
This is my homepage where I have used it: https://tinadubinsky.com/
This is a blog page with a different hero element where I don’t want to use the same design: https://tinadubinsky.com/sent-to-coventry/
With the previous headers, I had a similar design to the homepage but with the picture and text on reverse sides. To achieve this, I used the shortcode from lightweight grid columns. I’m happy with the way the homepage looks now, I don’t want to change the element for this page.
What I’m trying to achieve now, is to get the blog page back to how it looked with just text centred on the page, no images. Instead of it being to the right. And that’s what I had before I entered the CSS to get the design for the home page header.October 20, 2018 at 8:16 pm #706187LeoStaffCustomer Support
So sounds like you just need to create a new page hero like Example 1 here and use it for the blog page?
Or I’m missing something here?October 20, 2018 at 10:20 pm #706209Tina
But the CSS for Example 3 effects it.
I need help to work out how to reverse the CSS so it doesn’t affect other hero pages.
In particular this CSS from example 3:
grid-template-areas: “left right”;
-ms-grid-columns: 50% 50%;
grid-template-columns: 50% 50%;
}October 21, 2018 at 7:34 am #706396DavidStaffCustomer SupportOctober 22, 2018 at 2:39 am #706986Tina
Wonderful. Thanks for your help, David.October 22, 2018 at 2:45 am #706991
- You must be logged in to reply to this topic.