Hide the previous/next arrows on the product page on desktop

LucyBold · November 19, 2023

Hello!
I want to remove the navigation arrows on the image gallery of the Product pages of my site.
DESKTOP: remove arrows
MOBILE: remove arrows but leave number (1/4)

Thannk you!

tuanphan · November 22, 2023

Hi,

Can you share link to a product?

LucyBold · November 22, 2023

Hi @tuanphan
Here it is https://www.lacalifornie.es/all/p/z95p3wlcl4lh7jw-8k7kl-cwag8-hl4sg-27wsx-grt2g-pzsw9

Thanks for your help

Web_Solutions · November 22, 2023

28 minutes ago, LucyBold said:

Hi @tuanphan
Here it is https://www.lacalifornie.es/all/p/z95p3wlcl4lh7jw-8k7kl-cwag8-hl4sg-27wsx-grt2g-pzsw9

Thanks for your help

Add these code on Custom CSS panel in Website > Utilities > Website Tools > Custom CSS.

.view-item .product-item-gallery-carousel-control {
    visibility: hidden !important;
}

LucyBold · November 22, 2023

Thank you @Web_Solutions! It works nicely!

Hide the previous/next arrows on the product page on desktop

Recommended Posts

LucyBold

Link to comment

Top Posters In This Topic

Popular Days

Top Posters In This Topic

Popular Days

tuanphan

Link to comment

LucyBold

Link to comment

Web_Solutions

Link to comment

LucyBold

Link to comment

Create an account or sign in to comment

News

Events

Circle Day

Resources

Squarespace Webinars

Hire a Designer

Support

Community

Developers

Resources