Jump to content

How to COMPLETELY disable carousel in product

Recommended Posts

Hi there, I have added 2 images to a product, but as "main" image I don't want the user to be able to go through them, I want it to be static.

By adding 

//hide carousel in product page
.ProductItem-gallery-thumbnails {
 display:none;
}

I managed to hide the thumbnails underneath the main image, HOWEVER, I can still move through the images by pressing left/right arrow keys AND by sliding my finder on mobile.

 

How can I make that first imagine completely static?

 

Thanks in advance!

Link to comment
  • Replies 6
  • Views 904
  • Created
  • Last Reply
On 12/1/2020 at 11:47 AM, tuanphan said:

Can you share link to product in your question? We can check easier

Any of my poducts (for example https://www.audiobrewers.com/shop/p/ambisonics-test-library) contain 2 pictures, the "cover" picture and a small thumbnail that is visible for the Cart. I hid the carouser underneath but as you can see, even if you press left/right arrows AND if you slider left/right with your finger on mobile, it still goes to the next image!

 

Thanks!

Link to comment
On 12/8/2020 at 1:47 PM, Alejoca said:

I have added 2 images to a product, but as "main" image I don't want the user to be able to go through them. My products contain 2 pictures, the "cover" picture and a small thumbnail that is visible for the Cart.

Have you tried deleting the additional images so that you have a single product image?

product-images-new-product-composer.thumb.png.61770eb2f3bfa4c6f90bf9fb00af36a9.png

 

 

About me: I've been a SQSP User for 18 yrs. I was invited to join the Circle when it launched in 2016. I have been a Circle Leader since 2017. I don't work for Squarespace. I value honesty, transparency, diversity and good design ♥.
Work: I founded and run SF.DIGITAL, building Squarespace Extensions to supercharge your commerce website. 
Content: Views and opinions are my own. Links in my posts may refer to SF.DIGITAL products or may be affiliate links.
Forum advice is free. You can thank me by clicking one of the feedback emojis below. Coffee is optional.

Link to comment

Hi @paul2009 - this does not work, as soon as I delete the second picture, the product stops having that picture as a thumbnail for when it's added to cart.

With two pictures:

image.png.06cfa23e15c60314783f59ee1a17550b.png

 

On the SKU thumbnail I can have the second picture as thumb:

image.png.12c0c2b25ee55532e3ab908159c05764.png

 

Once I remove the second picture:

image.png.2a3ff647961b32327b6f2ff2c7ba3b56.png

 

The picture on SKU disappears:

image.png.db1dc052f1f0b0c05a51080d74e98b91.png

 

Please mind that NEW EDITOR doesn't have this feature, which is something to miss when your product cover is a rectangular picture and the "cart picture" is a square picture.

 

So, I am sure with CSS there must be a way to deactivate the swipes/left-right keystrokes?

 

 

Link to comment

Archived

This topic is now archived and is closed to further replies.


×
×
  • Create New...

Squarespace Webinars

Free online sessions where you’ll learn the basics and refine your Squarespace skills.

Hire a Designer

Stand out online with the help of an experienced designer or developer.