Collection images not displaying on mobile

Community resources General
1

I have a blog collection with images and text that displays fine in Designer and fine on a laptop, but on tablet/mobile viewpoint most (but not all) of the images aren’t displaying. Does anyone have any ideas what I could be doing wrong?

https://www.cow-shed.co.uk/articles

2

Hi Emma,

Could you share a read only link of your project? I think I might have an idea as to what could be causing your issue.

3

I’d be happy to but I’m not sure how I do that? Could you let me know?

4

To the left of the “Publish” button there should be a share button. After clicking that make sure you switch on the “Share read-only link” option and then copy your preview URL.

5

Brilliant - thanks so much - here it is

https://preview.webflow.com/preview/cow-shed?utm_medium=preview_link&utm_source=designer&utm_content=cow-shed&preview=b4742709b5ef332feaac5b6dc4d31247&mode=preview

6

So, what I would first try is ensuring that the images are taking up the full-width of the div block. I notice all of your images have a max-width of 100%. Try adding a width of 100% as well to the image in the CMS item. Let me know how that works.

1 Like
7

Thanks so much for the suggestions - I just tried that - but it hasn’t fixed it.

I can’t work out why some are working and others aren’t?

8

Most of the images were imported in from my old site (I put the url in the import spreadsheet).

I notice the images which are displaying ok have not been resized by Webflow but the ones which aren’t have a couple of sizes created

So this one works :
Smart Cane Startup

and this one doesn’t
Plant-based Burger Startup

I don’t understand how webflow creates the image snapshots so I don’t know why its creating different sizes for some and not for others, and why the ones it creates don’t show up on the mobile.

9

Oh sorry - I meant to post the code but its posted the photos - here is a screenshot

Screenshot 2021-04-23 at 21.21.08
Screenshot 2021-04-23 at 21.21.081772×736 231 KB

You can see the one that doesn’t work has several sizes created, but the one that does work just has one size

10

Aside from the adjustment I suggested, I’m not sure what else you did - but on my phone, it looks like all of the photos are full-width and working properly.

1 Like
11

Oh you are right - its working fine on my phone portrait now! But its missing the photos off the phone landscape (all other view points are working). So strange

12

Did you set the image “width: 100%” on just the mobile portion or for tablet through mobile layouts as well?

1 Like
13

Thank you so much!! Of course that was the problem. I’m really grateful - that was driving me mad!

14

You’re welcome! Glad I could help!

1 Like