Product page – image arrows color and shape
-
I want to set the arrows on product page to be black on a transparent background, how can I do that?
Second problem is that the arrows don’t always look the same. How can I make them always be the same shape?
I tried with css code, but it didn’t work:
.slick-prev:before, .slick-next:before {
color: #000 !important;
}
.thumbnails.slick-slider {
background-color: #fff !important;
box-shadow:none
}
Attachments:
You must be
logged in to view attached files.
Hello,
Here is a code for making the buttons transparent.
.single-product .woocommerce-product-gallery .slick-arrow {
background-color: transparent;
}
The arrows don’t always look the same because the thumbnails have different width. Please navigate to Theme Settings -> Single product -> Images -> set e.g. 150px for the “Thumbnails image width” field.
https://take.ms/lJuBa
Kind Regards
.
