Looking to add a banner image on collection pages - or edit existing section?

[Drazdauskas]

Hello All,

I am using the Flow theme by Eight.

I am trying to add a simple banner image with some text along the top of each collection page using dynamic sources (metafields).

It seems there “Image with text overlay” is almost perfectly suited to allow this.

The only flaw I have is that within this section they have a “Minimum section height” which changes the size of the image. When set on “small” the image is still too big to have as a banner image. See below

Their collection list page does have a “featured image size” area in the main “All collections” section, which does allow for a much better sized image - but then you cannot add text, and cannot apply this section within individual collection pages, so it doesn’t really suit - but does show how I wish the image to display. See below

I would be grateful if anyone could help me achieve the desired effect on this

Thanks

[Drazdauskas]

I think I have manage to achieve my desired outcome now - however I would like to know how to reduce the height on mobile - if anyone still comes across this - and wants to help out

[globalwebsols]

@Drazdauskas in Shopify when you add text on image they automatically apply the padding on top and bottom thats why image size increase. it will be fixed by using CSS code.

Also for mobile we should use media quries to fix the height as per screen size. its possible and i can do that.