Re: Mobile product gallery displaying incorrect number of images

lilyioti · ‎09-23-2024

The number of images on my mobile store is displaying incorrectly, I only have 2 images but it says there are 3. Does anyone have a solution to this? I am using dawn

Dan-From-Ryviu · ‎09-23-2024

Hi @lilyioti

Please add this code to theme.liquid file, after <head>

<style>
@media (max-width: 749px) {
    .product .slider.slider--mobile { scroll-padding-left: 0 !important; }
    .product .grid--peek.slider .grid__item { width: 97% !important; }
    .product .grid--peek.slider .grid__item:first-of-type { margin-left: 0px !important; }
    .product .grid--peek.slider--mobile { width: calc(100% + 1.5rem) !important; }
}
</style>

- Found this helpful? Hit "Like" and "Accept as Solution"! - Feeling generous. ☕ Buy me coffee!
- Reton: Loyalty & Rewards - Earn points through tasks, redeem for discounts, and enjoy exclusive VIP rewards!
- Ryviu - Reviews & QA app: Collect product reviews, import reviews from AliExpress, Amazon, Etsy, Walmart, Shopee, Dhgate and CSV.
- Lookfy Gallery: Lookbook Image - Gain customers with photo gallery, video & shoppable image
Built for Shopify

Reelfy‑Shoppable Videos+Reels: Create shoppable videos to engage customers and drive more sales.
- En...Sign up now.

View solution in original post

Robert_Kanaan · ‎09-23-2024

@lilyioti Just tested this on Dawn, and it appears to display the correct count. Could you please share your store's password for a closer look.

Robert Kanaan | Web Developer @ GoVedia
Building apps & custom solutions
robert@govedia.com
https://govedia.com

Robert_Kanaan · ‎09-23-2024

@lilyioti Based on the HTML, it looks like you're using an app that's involved with the multi-image functionality. This issue might be related to the app. While I can't confirm without further investigation, it could be helpful to reach out to their support team for assistance. Specific details were shared directly with you via private message.

Robert Kanaan | Web Developer @ GoVedia
Building apps & custom solutions
robert@govedia.com
https://govedia.com

Dan-From-Ryviu · ‎09-23-2024

Hi @lilyioti

Please add this code to theme.liquid file, after <head>

<style>
@media (max-width: 749px) {
    .product .slider.slider--mobile { scroll-padding-left: 0 !important; }
    .product .grid--peek.slider .grid__item { width: 97% !important; }
    .product .grid--peek.slider .grid__item:first-of-type { margin-left: 0px !important; }
    .product .grid--peek.slider--mobile { width: calc(100% + 1.5rem) !important; }
}
</style>

- Found this helpful? Hit "Like" and "Accept as Solution"! - Feeling generous. ☕ Buy me coffee!
- Reton: Loyalty & Rewards - Earn points through tasks, redeem for discounts, and enjoy exclusive VIP rewards!
- Ryviu - Reviews & QA app: Collect product reviews, import reviews from AliExpress, Amazon, Etsy, Walmart, Shopee, Dhgate and CSV.
- Lookfy Gallery: Lookbook Image - Gain customers with photo gallery, video & shoppable image
Built for Shopify

Reelfy‑Shoppable Videos+Reels: Create shoppable videos to engage customers and drive more sales.
- En...Sign up now.

lilyioti · ‎09-24-2024

This worked great! Thank you so much 🙂

Dan-From-Ryviu · ‎09-24-2024

Very welcome!

- Found this helpful? Hit "Like" and "Accept as Solution"! - Feeling generous. ☕ Buy me coffee!
- Reton: Loyalty & Rewards - Earn points through tasks, redeem for discounts, and enjoy exclusive VIP rewards!
- Ryviu - Reviews & QA app: Collect product reviews, import reviews from AliExpress, Amazon, Etsy, Walmart, Shopee, Dhgate and CSV.
- Lookfy Gallery: Lookbook Image - Gain customers with photo gallery, video & shoppable image
Built for Shopify

Reelfy‑Shoppable Videos+Reels: Create shoppable videos to engage customers and drive more sales.
- En...Sign up now.

namphan · ‎09-23-2024

Hi @lilyioti,

This is because you removed the spacing between the images, so the JS calculations for it didn't work properly.

If you want, I can send you a collaborator invite and debug it.

☕ Coffee tips fuels my dedication.
Shopify Development Service
➜ PageFly Page Builder Optimize your Shopify store (Free plan available)
Need help with your store? namphan992@gmail.com

Re: Mobile product gallery displaying incorrect number of images

Mobile product gallery displaying incorrect number of images

Community Blog Articles