Slideshow Overlay Color - Question | JoomShaper
Black Friday sale is live with flat 50% OFF. Sale ends soon! Grab your deal now!

Slideshow Overlay Color

DK

Douglas Kirimi

Template 3 years ago

Hi, how do i edit the overlay color to this slideshow? https://betterglobeictke.com/symonns

0
17 Answers
Mehtaz Afsana Borsha
Mehtaz Afsana Borsha
Accepted Answer
Support Agent 3 years ago #66112

Use this custom CSS

.sppb-fullwidth-slider .sppb-fullwidth-slider-item-bg:before{
  background-color: #F9F5F5!important; 
    opacity:.3;
}
0
Mehtaz Afsana Borsha
Mehtaz Afsana Borsha
Accepted Answer
Support Agent 3 years ago #65559

Hi

Thanks for contacting us. You can use this custom CSS

.sppb-fullwidth-slider .sppb-fullwidth-slider-item-bg:before{
  background-image:linear-gradient(-180deg, rgb(196 128 128 / 70%) 6%, rgb(166 150 150 / 60%) 98%)!important; 
}

Path towards custom CSS: Extensions>Templates>Styles> Click on your current default template name then choose Template Options. Then find custom CSS within the custom code.

-Regards.

0
DK
Douglas Kirimi
Accepted Answer
3 years ago #65638

Thanks, will try it and let you know

0
Mehtaz Afsana Borsha
Mehtaz Afsana Borsha
Accepted Answer
Support Agent 3 years ago #65684

Yeah sure please let me know is this working or not.

0
DK
Douglas Kirimi
Accepted Answer
3 years ago #65689

Hi, i have tried it and it had a different color for the overlay. Could you please send me code for the same 'Whitish' overlay that is just less bold. I am also not too familiar with this RGB

0
Mehtaz Afsana Borsha
Mehtaz Afsana Borsha
Accepted Answer
Support Agent 3 years ago #65691

I think this site may help you to choose your color.

https://www.rapidtables.com/web/color/RGB_Color.html

You can select color from here and give me that I will then modify the code and send it to you,

0
DK
Douglas Kirimi
Accepted Answer
3 years ago #65697

Hi, thanks for the link. I think #F9F5F5 should work well, can you modify the code with that?

0
Mehtaz Afsana Borsha
Mehtaz Afsana Borsha
Accepted Answer
Support Agent 3 years ago #65704

Is this ok?

https://prnt.sc/wKwJ4mowfcGQ

Then you have to use this code

.sppb-fullwidth-slider .sppb-fullwidth-slider-item-bg:before{
  background-image:linear-gradient(-180deg, rgb(249,245,245) 6%, rgb(171 171 171 / 60%) 98%)!important; 
}
0
DK
Douglas Kirimi
Accepted Answer
3 years ago #65711

Oh noo. That is not it! You see the current overal that is already there, i just want it to be lighter..much lighter so that the images can be more visible

0
DK
Douglas Kirimi
Accepted Answer
3 years ago #65814

Hi, were you able to get code to make the white background 'lighter'?

0
DK
Douglas Kirimi
Accepted Answer
3 years ago #65815

No gradient needed, just color..

0
Mehtaz Afsana Borsha
Mehtaz Afsana Borsha
Accepted Answer
Support Agent 3 years ago #65833

If you want only background color then use this custom CSS

.sppb-fullwidth-slider .sppb-fullwidth-slider-item-bg:before{
  background-color: #F9F5F5!important; 
}
0
DK
Douglas Kirimi
Accepted Answer
3 years ago #65879

Thanks Mehtaz, but what about transparency?

0
Mehtaz Afsana Borsha
Mehtaz Afsana Borsha
Accepted Answer
Support Agent 3 years ago #65944
0
DK
Douglas Kirimi
Accepted Answer
3 years ago #66037

Hi, Mehtaz. Can you try and make it lighter, the image to be a bit more visible?

0
DK
Douglas Kirimi
Accepted Answer
3 years ago #66114

Thanks Mehtaz, much better

0
Mehtaz Afsana Borsha
Mehtaz Afsana Borsha
Accepted Answer
Support Agent 3 years ago #66117

Glad to know that:) You are always welcome!

It would be very kind of you if you can manage some moment to give us feedback here:

https://extensions.joomla.org/extension/sp-page-builder/

https://www.trustpilot.com/review/www.joomshaper.com

Please let me know your name on the review. Thanks for being with us :)

0