Dawn theme - how can I customize "Image Banner" height?

Hi,

Could you please help me customize the height of the “Image Banner” element in the Dawn theme?
(I would like to use the built-in free pictures, that’s why simply cropping the image itself is not a solution for me)

Thank you!
Laszlo

1 Like

@Laszlo2

Sorry you are facing this issue, it would be my pleasure to help you.

Welcome to the Shopify community! :blush:
Thanks for your good question.

Please share your site URL,
I will check out the issue and provide you a solution here.

Hi @KetanKumar , sorry for the late reply.

https://rendeljmasnak-proba.myshopify.com/

password: “gyermek”

My problem is basically that the welcome image on the home page is too big, (with the kids standing back) it takes the whole screen.

It would be the best to decrease the size in both dimensions, so avoiding the image to be cropped too much.
If you have a solution, I will need to experiment for the best result, across different screen sizes.

Thank you!
Laszlo

1 Like

@Laszlo2

do you mean like this?

Yes!

I’m looking forward the solution.
Additionally, if it is possible to find the parameters, to decrease the picture width as well. It would be nice to have the picture width less than the screen width.

@Laszlo2

yes please me know mockup how do you have like?

Hi @Ketan

could you please elaborate on your previous question? unfortunately I didn’t understand what you mean:

“yes please me know mockup how do you have like?”

Thanks

@Laszlo2

Hi Laszlo,

To customize the height of the “Image Banner” element in the Dawn theme, first create a backup version of your site, avoid working in the original version!

Next go to the code editor. Click on Assets > section-image-banner.css . In the line 65 we will find the selector .banner_media with the height definition, if you want to make the image visible remove the height: 100%.

@media screen and (min-width: 750px) {
  .banner__media {
    height: 100%;
  }
}

Save the changes before making a preview.

I hope this helps!

All the best, Bruno

1 Like

Hello. I need some assistance with my dawn theme banner. For some reason it is not a landscape instead its a portrait. I know my score is down because of it. I think it’s to big. I have an image I made on Canva specifically for my shopify dawn theme banner but when I try to upload it it says it cannot exceed 20 megapixels. I dont even know what that mean. Can you help me out please

1 Like

@Ketiabell

Sorry you are facing this issue, it would be my pleasure to help you.

Welcome to the Shopify community! :blush:
Thanks for your good question.

Please share your site URL,
I will check out the issue and provide you a solution here.

Sure https://konfidenceboutique.online/

@KetanKumar

1 Like

@Ketiabell

yes please share issue images?

The problem is I settled for a premade banner. I want to use a banner I created in Canva designing tool and use that for my banner. When I attempt to upload it, it tells me I cant because it exceeds 20 megapixels. What should the measurements be for Dawn theme banner?

1 Like

@Ketiabell

yes please reduce image size doesn’t support 20 mega pixel image size

@KetanKumar Do you recommend me an app to resize the photo without losing quality?

1 Like

@Ketiabell

you have try this

https://apps.shopify.com/photo-resize-by-pixc