How to make an image vertical when viewing on mobile

hakamount
Explorer
82 1 15

Hey Guys,

We recently added a new image to our homepage as a slideshow image (it's the only image in the slideshow).

In desktop it looks good but when viewing in mobile, the image stays in landscape mode which makes it really small and hard to see.

I've seen other websites change the orientation of their images to vertical when viewing in mobile - how do I do this?

1. My image (vertical in mobile)

hakamount_0-1637702733053.png

2. A similar image in vertical whilst viewing in mobile (this is what i'd like to replicate - note: it shows as landscape when in desktop view which is perfect)

 

hakamount_3-1637702851891.png

 

Can anyone tell me how to have my image landscape/horizontal when in desktop, but vertical when in mobile?

 

Thanks

Josh

 

Replies 7 (7)
JHKCreate
Shopify Partner
2920 504 723

Hi @hakamount 


Would you mind sharing your store's URL so we can take look at that and provide you with a solution?

 

Cheers!

- Did we solve your issue? Like & Mark As Solution to help the community
- Should you need any direct help: contact@jhkcreate.com
- Learn more about us: jhkcreate.com
- Satisfied with our solutions? Drop a review on Google

JHKCreate
Shopify Partner
2920 504 723

Well received, thanks! Would you mind just linking us to the page/section where this issue is present? It's not on the homepage it seems. Let me know!

- Did we solve your issue? Like & Mark As Solution to help the community
- Should you need any direct help: contact@jhkcreate.com
- Learn more about us: jhkcreate.com
- Satisfied with our solutions? Drop a review on Google

hakamount
Explorer
82 1 15

Hey @JHKCreate - apologies it's not visible on the homepage if you scroll down about half way. 'Why hakamount' is the title of the slideshow banner

JHKCreate
Shopify Partner
2920 504 723

I can see it now, the issue here is that this is an image, not three distinct columns, so on mobile it will be displayed the same. Have you tried using the Image + Text section in the theme to recreate this instead?

 


Let me know!

- Did we solve your issue? Like & Mark As Solution to help the community
- Should you need any direct help: contact@jhkcreate.com
- Learn more about us: jhkcreate.com
- Satisfied with our solutions? Drop a review on Google

hakamount
Explorer
82 1 15

Hey @JHKCreate - I looked at it, but the image + text layout on my theme looks like this. I kind of need a landscape layout for desktop.

hakamount_0-1637790713207.png

 

JHKCreate
Shopify Partner
2920 504 723

My bad, I meant the "Text columns with Images" section instead. Let me know!


If you haven't got that, then a custom coding of this section is necessary to get the desired result. Let me know!

- Did we solve your issue? Like & Mark As Solution to help the community
- Should you need any direct help: contact@jhkcreate.com
- Learn more about us: jhkcreate.com
- Satisfied with our solutions? Drop a review on Google