Docs

[jkais]

Hello!

I would love to be able to change the color, or opacity, or something, of the next and previous buttons in Layerslider. Any ideas? They are white, and I am using them with slides that are mostly white, so the buttons disappear.

Thanks,
Jeff

[jkais]

This reply has been marked as private.

[jkais]

This reply has been marked as private.

[Christopher]

Hi there,

Please add following code in Customize -> Custom -> Global CSS :

.ls-v6 .ls-nav-prev:after, .ls-v6 .ls-nav-next:after,.ls-v6 .ls-nav-prev:after {

    border-left: 3px solid rgba(156, 15, 15, 0.75);
}
.ls-v6 .ls-nav-next:after {
    border-right: rgba(156, 15, 15, 0.75);
}

Hope that helps.

[jkais]

Hi Christopher,

This did not work for me. Any other ideas?

Thanks so much for your help.

Jeff

[Christopher]

Hi there,

Please implement the code and provide us with correct login credentials.

Thanks.

[jkais]

This reply has been marked as private.

[Christopher]

Please update your code to :

.ls-v6 .ls-nav-prev:after {
    border-left: 3px solid rgba(156, 15, 15, 0.75) !IMPORTANT;
}
.ls-v6 .ls-nav-next:after {
    border-right: 3px solid rgba(156, 15, 15, 0.75) !important;
}
.ls-v6 .ls-nav-prev:after, .ls-v6 .ls-nav-next:after {

    border-top: 3px solid rgba(156, 15, 15, 0.75) !IMPORTANT;
}

Hope it helps.

[jkais]

Wonderful! When I hover over them, they show a different button that is white…can that be easily changed as well?

[Christopher]

Please add this code too :

.ls-v6 .ls-nav-prev:hover:after {
    border-top-color: rgb(61, 195, 121) !important;
    border-left-color: rgb(61, 195, 121) !important;
}
.ls-v6 .ls-nav-next:hover:after {
    border-top-color: rgb(61, 195, 121) !important;
    border-right-color: rgb(61, 195, 121) !important;
}

Hope it helps.

[jkais]

Hi, that didn’t work for me.

[Christopher]

Please try this code :

body .ls-v6 .ls-nav-prev:hover:after {
    border-top-color: rgb(61, 195, 121) !important;
    border-left-color: rgb(61, 195, 121) !important;
}
body .ls-v6 .ls-nav-next:hover:after {
    border-top-color: rgb(61, 195, 121) !important;
    border-right-color: rgb(61, 195, 121) !important;
}

This one should work.

Thanks.

[jkais]

Perfect. Thank you so much, Christopher. I am very grateful for your help!

all the best,
Jeff

[Rahul]

We’re happy to help you!

Feel free to ask us again.

Thanks!

[Author]

Posts