Why aren't images displaying on mobile in Shopify?

DRP996
Excursionist
22 0 5

Hi, was wanting some help.

All images load fine, but my main page the blocks don't load the images on iphones, but only show the text.

Even on the preview it looks as its designed to work this way.

Im sure somewhere in the CSS its hidden somewhere to hide images on iphones, does anyone know where to look and what to look for, just a rough idea and ill figure it out.

 

Thanks alot

Replies 34 (34)

KetanKumar
Shopify Partner
36839 3635 11972

Hello, @DRP996 
Welcome to the Shopify community!
Please share your site URL,
So I will check and provide a solution here.

If helpful then please Like and Accept Solution.
Want to modify or custom changes on store Hire me.
- Feel free to contact me on bamaniyaketan.sky@gmail.com regarding any help
Shopify Partner | Skype : bamaniya.sky
PSD to Shopify | Shopify Design Changes | Shopify Custom Theme Development and Desing | Custom Modifications In to Shopify Theme | SEO & Digital Marketing
adrianalvarez
Visitor
1 0 1

Hi I can't see my product images on mobile either https://cyo.mx/products/workshop-realismo-espontaneo-con-diego-guzman

 

Help me please!

KetanKumar
Shopify Partner
36839 3635 11972

@adrianalvarez 

Yes, please add this code

1. Go to Online Store->Theme->Edit code
2. Asset->/theme.css ->paste below code at the bottom of the file.
this code apply for after 5 - 6 second

@media (max-width: 575px) {
.visible-xs {
    opacity: 1;
}
}

 

If helpful then please Like and Accept Solution.
Want to modify or custom changes on store Hire me.
- Feel free to contact me on bamaniyaketan.sky@gmail.com regarding any help
Shopify Partner | Skype : bamaniya.sky
PSD to Shopify | Shopify Design Changes | Shopify Custom Theme Development and Desing | Custom Modifications In to Shopify Theme | SEO & Digital Marketing
htalmousst
Visitor
1 0 0

Hi, could you help me solve this issue please, 

All the Product images in the product page are hidden in Mobile (everything is working good in Desktop but in Mobile NOT!)

This is the product page link : koziinti.myshopify.com/collections/الأكثر-طلبا-هذا-الأسبوع/products/

As you can see no image is shown, but there are their place

htalmousst_0-1621105377262.png

You need to scroll down everytime you enter product page to see its content

htalmousst_1-1621105507487.png

 

KetanKumar
Shopify Partner
36839 3635 11972

@htalmousst 

KetanKumar_0-1621141392700.png

We have checked for this issue in real system and browserstack but it is working ok. In which system configuration or browser you are checking?

If helpful then please Like and Accept Solution.
Want to modify or custom changes on store Hire me.
- Feel free to contact me on bamaniyaketan.sky@gmail.com regarding any help
Shopify Partner | Skype : bamaniya.sky
PSD to Shopify | Shopify Design Changes | Shopify Custom Theme Development and Desing | Custom Modifications In to Shopify Theme | SEO & Digital Marketing
haroldmeagandev
Visitor
2 0 2

Hi Ketan,

We are experiencing similar kind of issue. Images are not visible in mobile view. We tried to temporarily resolve the issue by duplicating the product, and it worked also but after 2 days we are again facing similar issue. Can you please help us here 

 

Store name : Harold Meagan 

Website : www.haroldmeagan.com 

KetanKumar
Shopify Partner
36839 3635 11972

@haroldmeagandev 

We have checked for this issue in real system and browserstack but it is working ok. In which system configuration or browser you are checking?

If helpful then please Like and Accept Solution.
Want to modify or custom changes on store Hire me.
- Feel free to contact me on bamaniyaketan.sky@gmail.com regarding any help
Shopify Partner | Skype : bamaniya.sky
PSD to Shopify | Shopify Design Changes | Shopify Custom Theme Development and Desing | Custom Modifications In to Shopify Theme | SEO & Digital Marketing
CCCeramics
Visitor
1 0 0

Hello! I am having a similar problem where my images in mobile view are not loading. Would you be able to help me remedy this also? 

www.carriecreech.com

 

Thank you!

KetanKumar
Shopify Partner
36839 3635 11972

@DRP996 

1. Go to Online Store->Theme->Edit code
2. Asset->/responsive.css->paste below code at the bottom of the file.

.custom_showcase__1 img
can you please remove this class css

If helpful then please Like and Accept Solution.
Want to modify or custom changes on store Hire me.
- Feel free to contact me on bamaniyaketan.sky@gmail.com regarding any help
Shopify Partner | Skype : bamaniya.sky
PSD to Shopify | Shopify Design Changes | Shopify Custom Theme Development and Desing | Custom Modifications In to Shopify Theme | SEO & Digital Marketing
edjerf
Tourist
3 0 2

Hello - this solution isn't working for me. I don't have that section available - can someone please provide further instructions on how to fix.

 

RE: Product Pages on Mobile. Scrolling button does not work to view additional images. it also only shows one image on whole page. Please help!

KetanKumar
Shopify Partner
36839 3635 11972

@edjerf 

Welcome to the Shopify community!
and Thanks for your Good question.

Please share your site URL,
So I will check and provide a solution here.

If helpful then please Like and Accept Solution.
Want to modify or custom changes on store Hire me.
- Feel free to contact me on bamaniyaketan.sky@gmail.com regarding any help
Shopify Partner | Skype : bamaniya.sky
PSD to Shopify | Shopify Design Changes | Shopify Custom Theme Development and Desing | Custom Modifications In to Shopify Theme | SEO & Digital Marketing
edjerf
Tourist
3 0 2
outeasteyewear.com

Thank you!!
edjerf
Tourist
3 0 2

out-east-eyewear.myshopify.com ....

 

everything looks okay when you view on desktop in mobile view but having issues on the website viewing on actual mobile website with the hamburger menu on product page + also the additional images on product pages are not appearing below nor are the arrows working. Any help with this would be much appreciated!!!

KetanKumar
Shopify Partner
36839 3635 11972

@edjerf 

Thanks for post 

can you please share further issue screenshots or videos?

If helpful then please Like and Accept Solution.
Want to modify or custom changes on store Hire me.
- Feel free to contact me on bamaniyaketan.sky@gmail.com regarding any help
Shopify Partner | Skype : bamaniya.sky
PSD to Shopify | Shopify Design Changes | Shopify Custom Theme Development and Desing | Custom Modifications In to Shopify Theme | SEO & Digital Marketing
JustinBonaccors
Visitor
1 0 1

We are using the free Supply Theme and are having a similar issue on our site.

www.winecountrycraftsman.com

Images will load on desktop perfectly, but then on mobile you will only be able to see the first products image, all additional images are 'grouped' into a single section and are not selectable.

Screen Shot 2020-11-18 at 3.34.13 PM.png

KetanKumar
Shopify Partner
36839 3635 11972

@JustinBonaccors 

Welcome to the Shopify community!
and Thanks for your question.

1. Go to Online Store->Theme->Edit code
2. Asset->/theme.scss.liquid->paste below code at the bottom of the file.

.sc-badge-container {display: none !important;}

 

If helpful then please Like and Accept Solution.
Want to modify or custom changes on store Hire me.
- Feel free to contact me on bamaniyaketan.sky@gmail.com regarding any help
Shopify Partner | Skype : bamaniya.sky
PSD to Shopify | Shopify Design Changes | Shopify Custom Theme Development and Desing | Custom Modifications In to Shopify Theme | SEO & Digital Marketing
AllyP
Visitor
2 0 1

Hi Ketan, maybe you can help us as well. None of our product images are being shown to customers on mobile devices. Website is www.romancehelpers.com. Do you know how to fix this? Thanks, Ally

KetanKumar
Shopify Partner
36839 3635 11972

@AllyP 

Sorry for facing this issue, it's my pleasure to help us.

Welcome to the Shopify community!
and Thanks for your Good question. 😊

can you please share with us a further issue screenshot?

If helpful then please Like and Accept Solution.
Want to modify or custom changes on store Hire me.
- Feel free to contact me on bamaniyaketan.sky@gmail.com regarding any help
Shopify Partner | Skype : bamaniya.sky
PSD to Shopify | Shopify Design Changes | Shopify Custom Theme Development and Desing | Custom Modifications In to Shopify Theme | SEO & Digital Marketing
AllyP
Visitor
2 0 1

Here they are, basically no images at all even though in online store preview the mobile version looks fine. 

thank you! 

107C649B-0E60-4DE1-A780-50827AA88355.png

17687622-8F85-464A-9AF8-2F55F4C62213.png

Justice365
Visitor
1 0 0

Hi Ally, 

I have faced a similar problem to your described issue. I just looked at your website and found that you managed to get it working. May i know how did you resolve this? 

Otherwise, can anyone assist me in this situation? 

My website is gemflipflop.com, i am using brooklyn theme and i did a few edits on theme coding to allow grouping of images according to variant choice. 
I have attached several screenshot for your review. All designs show up without an issue on webpage, however, when on mobile. Some designs show and some doesnt. 


Dev code if its relevant to you. 

Justice365_0-1634577995790.png

 

WhatsApp Image 2021-10-19 at 01.22.16 (2).jpeg

WhatsApp Image 2021-10-19 at 01.22.16 (1).jpeg

WhatsApp Image 2021-10-19 at 01.22.16.jpeg

  

 

RosyXie
Visitor
1 0 0

Hi! Do you mind helping me to look at our website too?

5imple-life.com

the home page pictures are not showing on my iphone:(

coocootales
Tourist
7 0 2

Hello. I have the same issue, i.e. the product page does not load correctly on Some phones (other phones it is ok). www.coocootales.com

Can you please assist with this?

Many thanks.

Sofia

KetanKumar
Shopify Partner
36839 3635 11972

@coocootales 

We have checked for this issue in real system and browserstack but it is working ok. In which system configuration or browser you are checking?

If helpful then please Like and Accept Solution.
Want to modify or custom changes on store Hire me.
- Feel free to contact me on bamaniyaketan.sky@gmail.com regarding any help
Shopify Partner | Skype : bamaniya.sky
PSD to Shopify | Shopify Design Changes | Shopify Custom Theme Development and Desing | Custom Modifications In to Shopify Theme | SEO & Digital Marketing
coocootales
Tourist
7 0 2
First of all, many thanks for your prompt response.

Let me clarify that the images in the product page do not load only on some
mobile phones (nobody has complained about desktop). For example, a
colleague with an iphone 11 pro max using mobile safari ios 14.4.2 cannot
load the product page images (see attached)

However, her husband who has iphone 11 pro (not max) using mobile safari
ios 14.4.2, can load the product page correctly.

Many customers (with android phones also) have also complained about this.

Your kind assistance would be enormously appreciated.

Many thanks
coocootales
Tourist
7 0 2

Please see also these console errors which perhaps are relevant.

coocootales_0-1618246111165.png

Many thanks.

 

KetanKumar
Shopify Partner
36839 3635 11972

did you have to add any third partly code?

If helpful then please Like and Accept Solution.
Want to modify or custom changes on store Hire me.
- Feel free to contact me on bamaniyaketan.sky@gmail.com regarding any help
Shopify Partner | Skype : bamaniya.sky
PSD to Shopify | Shopify Design Changes | Shopify Custom Theme Development and Desing | Custom Modifications In to Shopify Theme | SEO & Digital Marketing
coocootales
Tourist
7 0 2
Hello. I have not added any code directly. However, I use some apps.

1) Langify to translate my site (I have however disabled it now because of
the problems)
2) Tabs - Product page tabs
KetanKumar
Shopify Partner
36839 3635 11972

@coocootales 

can you please disable and try?

If helpful then please Like and Accept Solution.
Want to modify or custom changes on store Hire me.
- Feel free to contact me on bamaniyaketan.sky@gmail.com regarding any help
Shopify Partner | Skype : bamaniya.sky
PSD to Shopify | Shopify Design Changes | Shopify Custom Theme Development and Desing | Custom Modifications In to Shopify Theme | SEO & Digital Marketing
coocootales
Tourist
7 0 2
Hello,

I have disabled Langify but have not disabled the tabs app as it is
essential to the operation of the site.

I have a newer update, customers with iphone have today advised me that the
product images in the product page cannot load with safari but they can
load with google chrome. Go figure.

Thanks,
Sofia
KetanKumar
Shopify Partner
36839 3635 11972

@coocootales 

can you please share again issue screenshot?

If helpful then please Like and Accept Solution.
Want to modify or custom changes on store Hire me.
- Feel free to contact me on bamaniyaketan.sky@gmail.com regarding any help
Shopify Partner | Skype : bamaniya.sky
PSD to Shopify | Shopify Design Changes | Shopify Custom Theme Development and Desing | Custom Modifications In to Shopify Theme | SEO & Digital Marketing
coocootales
Tourist
7 0 2
Hello,

It seems that a third party app (Langify) created the problem. I am in
contact with their developers and hope that the issue is resolved.

Thank you very much for all your kind efforts
KetanKumar
Shopify Partner
36839 3635 11972

@coocootales 

thanks for update and support

If helpful then please Like and Accept Solution.
Want to modify or custom changes on store Hire me.
- Feel free to contact me on bamaniyaketan.sky@gmail.com regarding any help
Shopify Partner | Skype : bamaniya.sky
PSD to Shopify | Shopify Design Changes | Shopify Custom Theme Development and Desing | Custom Modifications In to Shopify Theme | SEO & Digital Marketing
bevsidders
Visitor
2 0 0

Ketan,

My header LOGO is not showing when customers receive emails from me in Shopify.  Can you please tell me what to do to fix this?

 

The logo is supposed to be at the top of the page and I have alt text describing it.

 

Thanks, 

Bev Sidders Skincare

 

Beverly G. Sidders

sollgardens
Visitor
1 0 0

I'm having the same issue, I'm working on building our site and I cannot get the logo to appear on the mobile site. www.heartandsollgardens.com any advice would be much appreciated.