- This topic has 13 replies, 3 voices, and was last updated 3 years, 4 months ago by David.
-
AuthorPosts
-
December 6, 2020 at 3:42 am #1569092William
Hi there,
I made a header element for posts which looks all good, except it is not contained but appears full width.
You can see it here.
The look I’m going for, for this, is with something similar to this.
Is it possible to get the header element to be contained and, if so, the same width as the content?
Many thanks as always,
December 6, 2020 at 5:32 am #1569178DavidStaffCustomer SupportHi there,
try this CSS to keep your hero inner container the width of the primary container:
.page-hero .inside-page-hero.grid-container { max-width: 75%; margin-left: unset; }
December 6, 2020 at 7:46 am #1569400WilliamI currently have another header element that appears when there is a featured image, so don’t want to change that. See here compared to this , where does not have the container (as intended) for this featured image element.
I added the code and it made a slight shift for both headers, this and this.
The second link still is unable to look like this though.
December 6, 2020 at 11:32 am #1569560LeoStaffCustomer SupportCouldn’t you just set both the inner and outer container to be contained in the header element without any CSS?
December 7, 2020 at 11:56 am #1570755WilliamThat does not seem to work.
What I would like is for:
1) this header element to look the same as what can be seen here. (above content, but with sidebar to the side).
December 7, 2020 at 1:19 pm #1570835LeoStaffCustomer SupportWould it be ok if the sidebar moves up?
https://www.screencast.com/t/efJyofxzzyZDecember 7, 2020 at 2:15 pm #1570872WilliamThat’s what I want. This image below is how I want it to look:
This next image is the current look of it:
December 7, 2020 at 5:16 pm #1570993LeoStaffCustomer SupportThat case you can use this filter to move the page hero inside the content:
https://docs.generatepress.com/article/generate_page_hero_location/add_filter( 'generate_page_hero_location', function( $display, $element_id ) { if ( 10 === $element_id ) { return 'generate_before_content'; } return 'generate_after_header'; }, 10, 2 );
And edit the
10
to match the element ID.December 8, 2020 at 6:49 am #1571642WilliamIs that for both occurrences of ’10’?
It seems to partially work here. The sidebar needs an offset and the content appears quite far below though.
December 8, 2020 at 9:40 am #1571874LeoStaffCustomer SupportIs that for both occurrences of ’10’?
No sorry forgot to mention. Just this one needs to be changed:
10 === $element_id
The sidebar needs an offset and the content appears quite far below though.
That’s because the header element merged is turned on.
December 9, 2020 at 6:07 am #1572805WilliamDecember 9, 2020 at 7:25 am #1573018DavidStaffCustomer SupportEdit your Header Element and remove/reduce the padding.
December 9, 2020 at 7:38 am #1573034WilliamThat’s perfect thank you!!!!
December 9, 2020 at 7:57 am #1573067DavidStaffCustomer SupportGlad to hear that!
-
AuthorPosts
- You must be logged in to reply to this topic.