Viewed on desktop, the seven product images display as clickable thumbnails beneath the image.
Viewed on mobile, there are no thumbnails, and also no arrows or much of anything to indicate the images can be slid across.
If you squint, you can make out a very faint “1/7” indicator on the first image to load, but there is no cue to the user that they should slide the image with their finger. I can't work out how to change the styling of that overlay to make it more prominent.
Further, when you do slide you must be *exactly* horizontal, or your mobile browser will just scroll the whole page up or down, or even navigate forward or back on webpages.
Can I just have the thumbnails display on mobile?
Or a caption that says “1/7 - swipe” “3/7 - swipe” etc.?
Try adding to Home > Design > Custom CSS for product carousel
/* Product slide arrows control */
@media screen and (max-width:767px) {
.ProductItem-gallery-carousel-controls {
display: f
Site URL: https://www.simonocarrigan.com.au/shop/never-forget
Hi,
I’m adding products to my shop, and having problem with the UI disappearing on mobile and/or when the page is viewed in a narr
Question
SimonOCarrigan 2
Site URL: https://www.simonocarrigan.com.au/shop/never-forget
Hi,
I’m adding products to my shop, and having problem with the UI disappearing on mobile and/or when the page is viewed in a narrow browser window.
The example page to refer to is:
https://www.simonocarrigan.com.au/shop/never-forget
Viewed on desktop, the seven product images display as clickable thumbnails beneath the image.
Viewed on mobile, there are no thumbnails, and also no arrows or much of anything to indicate the images can be slid across.
If you squint, you can make out a very faint “1/7” indicator on the first image to load, but there is no cue to the user that they should slide the image with their finger. I can't work out how to change the styling of that overlay to make it more prominent.
Further, when you do slide you must be *exactly* horizontal, or your mobile browser will just scroll the whole page up or down, or even navigate forward or back on webpages.
Can I just have the thumbnails display on mobile?
Or a caption that says “1/7 - swipe” “3/7 - swipe” etc.?
I can only find one relevant article on the forums:
https://forum.squarespace.com/topic/155802-product-carousel-arrows-get-lost-on-mobile/#comment-345574
which discussed the same problem, with no solution.
Can this be logged as a feature request and/or can someone send me info on how to do a work around?
Thanks,
Simon
Link to post
Top Posters For This Question
7
4
3
2
Popular Days
Dec 8
3
Jun 26
2
Jun 28
2
Dec 9
2
Top Posters For This Question
tuanphan 7 posts
gmoss 4 posts
timbm 3 posts
mintykiwi 2 posts
Popular Days
Dec 8 2020
3 posts
Jun 26 2020
2 posts
Jun 28 2020
2 posts
Dec 9 2020
2 posts
Popular Posts
tuanphan
Try adding to Home > Design > Custom CSS for product carousel /* Product slide arrows control */ @media screen and (max-width:767px) { .ProductItem-gallery-carousel-controls { display: f
SimonOCarrigan
Site URL: https://www.simonocarrigan.com.au/shop/never-forget Hi, I’m adding products to my shop, and having problem with the UI disappearing on mobile and/or when the page is viewed in a narr
DavidLadipo
Did anyone succeed in finding a workaround to this problem?
Posted Images
30 answers to this question
Recommended Posts
Create an account or sign in to comment
You need to be a member in order to leave a comment