Hello, I have the Canopy theme and would like to edit the colors of the dots in the Testimonials section, as they only show up white on dark background. I want them to be seen on white/light background, so I need them to be a dark grey, preferably #6B7177. I do not see an easy way to do this when looking at the code, please advise.
Topic summary
Goal: Change the Testimonials section navigation dots in the Canopy theme from white to a dark grey (#6B7177) so they’re visible on light backgrounds.
Context: The requester couldn’t find an easy way in the theme code and shared their store URL and passcode upon request.
Solution provided: Add a CSS rule in the theme’s stylesheet.
- Path: Admin > Sales channels > Online store > Themes > Edit code > Assets > style.css
- Code:
.testimonials-section .slick-dots button::before {
color: #6B7177 !important;
}
Notes:
- The selector targets the testimonial slider’s dot icons (slick-dots) and forces their color to the specified grey.
- A screenshot was included to illustrate where to add the code.
Outcome: The requester confirmed the fix worked and expressed thanks.
Status: Resolved; no further questions or disagreements.
Hi @cid_gk could you share your store URL to check?
Yes, thank you:
https://gamekastle.myshopify.com/
passcode: gameon
Go to your store admin > Sale channels > Online store > Themes > Edit code > Assets > open style.css and add this code at the bottom
.testimonials-section .slick-dots button::before {
color: #6B7177 !important;
}
1 Like
Thank you so much!
1 Like