[Noukah]

Hi!

I’m using the Mona design, but can’t find a setting for adjusting the height of my header background image. It gets cropped when I upload it. How can I increase the height?

I also saw that the background image width gets cropped when viewing in mobile mode – is there a way to fix this as well?

Thanks in advance!

[serkan]

Hi, It is necessary to crop in terms of being responsive horizontally and vertically. To prevent this, it is advisable to load a more horizontal photograph.
Thanks

[ahmetsali]

Hi, you can adjust header height from “Customizer > Site Identity > Logo Margin”, but this only affects desktop layout, for mobile layout you can add this custom css code;

@media screen and (max-width: 991px) { .site-branding { padding: 80px 0; } }

[Noukah]

Thanks for the quick response!

I tried adjusting the logo margin, but my header image got bigger and even more cropped also on the sides, if that makes any sense.

I’m looking for a solution where I can use a static image in full size, that works on both devises and won’t get cropped. Maybe my image is too long? What’s the recommended size for a header image?

Thanks again!

[ahmetsali]

Hi again, recommended header background image width is 1920px, if your header parallax effect (Customizer > Header > General) is on, it may make your header bg image get cropped on the sides a bit to make the parallax effect work. If you can provide your related url, we can have a better opinion about your situation.