Collection Slider Arrows not working or showing on a page.

Hi, I need some help with a page I have just created at:

https://www.kiinbaby.com/pages/shop-by-colour

The arrows to scroll across the different collection colours are not showing. They do appear on the ‘Explore our range’ slider on our homepage https://www.kiinbaby.com/.

Please help I cant work out where to fix this issue and why it works on one page and not the other.

Thank you

Hello @Rosejane99 ,

its working but just because of transparent color its not visible.

Follow these steps to make them visible:

  1. Go to Online Store → Theme → Edit code

  2. Open your base.css file and paste the following code at the bottom:

.collections-slider svg path {
    fill: #cd9a2b;
}

If problem solved don’t forget to Like it and Mark it as Solution!
And if you need help with customization/code part you can contact me for services

You can find the email in the signature below.

Thanks

Hi Guleria,

Thank you for your help, that changed the colours of the slider buttons which is great. Unfortunately I forgot to mention in my post that I am able to see the slider arrows in Mobile mode but they disappear completely when in desktop mode. So my real issue is actually with the desktop mode not showing the arrows.

Thank you

I forgot to mention in my post that I am able to see the slider arrows in Mobile mode but they disappear completely when in desktop mode. So my real issue is actually with the desktop mode not showing the arrows.

Add this css too

.collections-slider 
 .swiper-button-lock {
    display: block !important;
}

If problem solved don’t forget to Like it and Mark it as Solution!
And if you need help with customization/code part you can contact me for services

You can find the email in the signature below.

Thanks

1 Like

Amazing! Thank you for your help! That has solved the issue.