Change height of Collection Header image

era2
Tourist
5 0 1

Hello!

I would like to edit the height (not width) of the collection image that appears in the collection header while browsing my shop. Currently it takes up the whole screen, but I'd prefer it to be a thinner banner. I'm using Impulse theme. The collection-header.liquid looks simple, but I can't find what in it I would need to alter to change the dimensions. Anything I've tried doesn't produce a change.

Could someone show me how I would go about changing the height of the collection header image?

URL is https://emma-brooke-jewelry.myshopify.com/, PW: nahlia

Thanks!

dmwwebartisan
Shopify Partner
9303 2153 2934

@era2 

Could you please provide a screenshot?

If helpful then please Like and Accept Solution | Email: dmw.webartisan@gmail.com | Instagram: @dmw.webartisan
Check here PageFly App to customize your pages | Bag is a cart drawer that maximizes your sales. View app →
0 Likes
Natztech
Shopify Partner
2139 548 1304

hello @era2 

can you please share a screenshot of the height of the Collection Header image

0 Likes
era2
Tourist
5 0 1

Here's a screenshot with the header enabled, and the second with it disabled. When enabled, I'd like to make it about half the height. If disabled, I'd also like to remove the white space between the content and the main header. Thanks!

Screen Shot 2021-09-28 at 8.40.34 AM.pngScreen Shot 2021-09-28 at 8.42.11 AM.png

0 Likes
Natztech
Shopify Partner
2139 548 1304

hello @era2 

please Go to Online Store-> Theme->Edit code then go to assets/theme.css ->paste the below code at the bottom of the file.

 for remove the white space between the content and the main header

 

.collection-content .grid .grid__item .page-width.page-content {
         padding-top: 0px;
}

 

 

 

era2
Tourist
5 0 1

Thanks! I added this to the end of assets/theme.css.liquid, but nothing seems to have changed with the white space.

0 Likes
era2
Tourist
5 0 1

Ooh! Regarding the white space, I think the padding is actually attached to my collection description. If I move the description to the bottom of the collection page, everything lines up well at the top. I think because the heading was written in H2, it was adding all that extra padding. Any idea where I would edit that? For now, just turning it off. Thanks for bearing with me!

0 Likes