Jump to content

Changing the colour of number of pictures in a product carousel

Recommended Posts

Site URL: https://chloeberland.com/

Hello everyone! 

I have a question and hope one of you can help me out.

When my site is in mobile, the arrows don't show on a product carousel (which I know is normal), but instead there's a white number of pictures on the upper right corner. My problem is that most of my pictures have white backgrounds, and it's impossible for mobile users to know that they can swipe to see other pictures. Do you happen to know what little chunk of custom CSS I can add to change that number's color? 

Thank you so much in advance and take care! 
Chloé 

I’ve included a pic so you all can know which number I’m talking about

product.PNG

Link to comment

Hi @Chloeberland,

Try adding this within Design > Custom CSS:

.ProductItem-gallery-current-slide-indicator{color:black!important;}

With this expected result on mobile:

image.png.304476247e259886a60a9ae74a879f78.pngimage.png.b707800bc79629ffed7b6112b85f539f.png

Hope this helps!
-Tyler

Edited by tcp13

Hey, I’m Tyler. 👋 I’ve been a professional Squarespace user since 2016. I’m a recovering startup founder, currently on sabbatical after selling my Squarespace business. I now spend my free time working on weird side projects and half-baked ideas.

Link to comment

Create an account or sign in to comment

You need to be a member in order to leave a comment

×
×
  • 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.