Tagged: mobile friendly
January 27, 2022 at 11:03 am #298526
Hi! Are there any plugins or codes to make my header image compatible with mobile? It looks great if I turn my phone horizontally, but it cuts out a lot of the image when my phone is held vertically. The header image has text so it’s basically just showing random letters when the phone is vertical. Thank you!January 27, 2022 at 10:46 pm #298560SkandhaKeymaster
@mpl92: Hello there,
Can you please post in your site URL so that I can look into the issue?
SkandhaJanuary 28, 2022 at 8:38 am #298606
If you visit on mobile, you’ll see that the text on the header is cut off when the phone is held vertically. Thanks for taking a look!January 30, 2022 at 11:33 pm #298742
Sorry if you are still looking into this, but I also tried an adaptive images plugin. It didn’t change the header on mobile, so I also contacted their team and they gave me this response:
It is this CSS property in this element https://prnt.sc/26l93nx/ that causes the image to extend beyond the visible part of your screen in mobile screen sizes. If it could be changed to this https://prnt.sc/26l968i/, ie
background-size: contain;, then the whole of the image would be contained inside the element and the screen.
It’s a little hard to say how your theme could accommodate this change. Perhaps it is some setting it can provide? Or perhaps a page builder? Or, ultimately, one could write some custom CSS in a child theme or in the Customizer.
Again apologies if this is stepping on your toes but maybe it’s helpful. I’m not really sure what I can do on my end with this information though, as I don’t know how to change CSS property.
- You must be logged in to reply to this topic.