How to change color of arrows and dot on lookbook carousel slider ?

[marjolein23]

Hi Team,

I made a lookbook on my home page – front page, the arrows and dots (the dots under the picture) are blue how/where can I change the color in my own color and with hover ? See the hereby images.

I’m still building the site so I probably may will have certainly more questions..

Best regards,

Marjolein

Attachments:

You must be logged in to view attached files.

[Foster]

Hi,
1. Use the code below please

.pm-slick .slick-arrow { background: #000; } /* normal state */
.pm-slick .slick-arrow:hover { background: #000; } /* hover state */

2.

.slick-slider .slick-prev,
.slick-slider .slick-next { background: #000; } /* normal state */
.slick-slider .slick-prev:hover,
.slick-slider .slick-next:hover { background: #000; } /* hover state */

4.

.pm-slick .slick-dots li button::before { color: #000; } /* Normal sate */
.pm-slick .slick-dots li button::before:hover { color: #000; } /* Hover state */
.pm-slick .slick-dots li.slick-active button:before { color: #000; } /* normal state of active */
.pm-slick .slick-dots li.slick-active button:before:hover { color: #000; } /* hover state of active */

Change #000 to the color which you want.
Cheers,
Foster

[marjolein23]

Hi Foster,

Thank for your fast answer !

This not working on the lookbook carousel slider. It works on the slider like under Trending  from demo home page 2 (I have also this slider on my home page).

How can I do on lookbook (carousel slider) ? (lookbook done with pin maker)

I joined the pictures of the lookbook carousel slider I used in my home page and from the demo home page 2 slider.

Cheers,

Marjolein

 

 

 

Attachments:

You must be logged in to view attached files.

[Harry]

Hi Marjolein,

You can use below code to fix on lookbook carousel.

.pin-maker.pm-slick .slick-arrow {
  background: #000;
}
.pin-maker.pm-slick .slick-arrow:hover {
  background: #000;
}

Please change #000 with your color.

Best regards

Harry
Premium Wordpress themes and plugins, Best WooCommerce theme https://themeforest.net/user/janstudio/portfolio?ref=janstudio

[marjolein23]

Hi Team,

This is working and changing the colors, but I don’t get it transparent like on the picture.

I want the same as on image, how do I get this ?

Best regards,

Marjolein

 

Attachments:

You must be logged in to view attached files.

[Harry]

Hi,

You can change prev code to

.pin-maker.pm-slick .slick-arrow {
background: none;
border: 1px solid #222;
color: #222;
}
.pin-maker.pm-slick .slick-arrow:hover {
background: none;
}

Best regards

Harry
Premium Wordpress themes and plugins, Best WooCommerce theme https://themeforest.net/user/janstudio/portfolio?ref=janstudio

[marjolein23]

Hello,

This is great working !

Thank you for your help.

Kind regards,

Marjolein

 

[Author]

Posts