Image won't show on mobile view

Store Design
,
1

Hi, i put a code with the picture so that if you press the image you see in the first screenshot it goes to my collection all page, but when i go to my site with mobile view the picture won’t show? How do i fix that?

Scherm­afbeelding 2025-03-13 om 21.20.12.png
Scherm­afbeelding 2025-03-13 om 21.20.12.png2940×1912 503 KB

Scherm­afbeelding 2025-03-13 om 21.20.25.png
Scherm­afbeelding 2025-03-13 om 21.20.25.png2940×1912 460 KB

2

Hi there! :blush:
Here’s the CSS code to resolve your issue:

@media screen and (max-width: 767px) {
div#Banner-template--24448134447441__image_banner {
    display: block;
    height: 100vw;
}}​

To add this to your Shopify theme, follow these steps:

  1. Go to Online Store in your admin panel.
  2. Click on Customize next to your active theme.
  3. Scroll down in the side panel until you find Custom CSS.
  4. Paste the code I provided.
  5. Save the changes.
    You should see the updates in real-time. Let me know if you need any more help! :rocket:
3

Hi! It worked thank you!

4

Hi! By any chance, do you know how i can make the picture bigger?

5

Hi there! I’m glad my response was helpful and solved your issue! :rocket:
If you’d like to stay updated with more Shopify tips and solutions, feel free to follow me on social media:
:glowing_star: https://www.instagram.com/e.nnovative/
If you want to support my work, you can buy me a coffee here: :hot_beverage: https://buymeacoffee.com/ennovative
Thanks again, and best of luck with your store! :yellow_heart:

6

Hi! I’ve followed you on Instagram. By any chance do you know how i can get the image bigger on mobile view?

7

you can change the:
height:100vw
to 120vw
130vw

try and choose the best fit for you