1 product shows on mobile. I want 2 like on the desk top.
https://marthajohnstonart.shop/collections/iki-and-his-mighty-friends
Topic summary
A Shopify store owner reports that their collection page displays only one product on actual mobile devices (Pixel phone and another Android), despite showing two products correctly on desktop and in browser mobile simulators.
Key developments:
- Multiple users confirmed seeing two products when testing via screenshots and browser developer tools
- A CSS code solution was provided to adjust mobile grid layout (targeting screens under 768px width)
- The code was successfully applied but did not resolve the issue
Current status:
The problem persists on physical devices despite working in simulated mobile views. There’s a discrepancy between how the page renders in desktop mobile preview tools versus actual mobile browsers. The issue remains unresolved, with the store owner confirming the CSS code is saved but still seeing only one product on real devices.
1 Like
wonderful. Thanks for checking. I have a pixel phone. it only shows one for me. hmmmm.
I checked my husbands android. same thing only one book shows
Thanks for checking. it still only shows one book on mobile for me. I checked my pixel and my husbands mobile same thing
@marthajohnston Can you please share the scrrenshot
Here is the desktop and mobile version when viewing childrens book in the menu
https://marthajohnstonart.shop/collections/iki-and-his-mighty-friends
I hope you are well. You can follow our instructions below:
1/ Shopify admin > Online store > Customize: https://prnt.sc/XQ6IDB99kUCd
2/ From the left menu > Theme settings > Open Custom CSS: https://prnt.sc/iDxwa8zBQ4Z-
3/ Copy the code below and paste it there
Here is the code for Step 3:
@media screen and (max-width: 768px){
div#ProductGridContainer .collection.page-width ul#product-grid li.grid__item {
width: 40% !important;
}
}
Please let me know if it works. Thank you!
Best,
Daisy - Avada Support Team.
Wow! thank you so much for the detailed directions and code.
Unfortunately,
I am still seeing only one book. When I view the mobile in the inspect view on my desktop the drop down listed my phone and it shows the 2 books.
Thanks for checking. when I check the mobile pixel dropdown in shopify it show 2 phone. but when I look on my and my husbands actual phone. it only shows one. so the desktop view of mobile is not accurate.
Thanks for checking. when I check the mobile pixel dropdown in shopify it show 2 phones. but when I look on my and my husbands actual phone, it only shows one. So the desktop view of mobile is not accurate.
Not sure if you saved the change after applying the code?
