How to customize the colors of the ''furniture" layout? - Forum | JoomShaper
Staff replied SP Page Builder

How to customize the colors of the ''furniture" layout?

Asked by GABRIEL NB 5 years ago Last activity 5 years ago

Hi, I'm looking for an option to change those orange colors around the layout, to adapt it to my white and blue template. How can I change the colors?

https://sppagebuilder.com/furniture-home

7 replies

Oldest first Newest first Most helpful
Mehtaz Afsana Borsha Staff
5 years ago

Hi,
Could you please give me a screenshot of your issue?

GABRIEL NB Asked this
5 years ago

Hello, thank you. In that case, I know how to fix it. But what about the orange titles? for example where it says "MODERN VELVET" in the image you sent me.

Mehtaz Afsana Borsha Staff
5 years ago

HI,
You can use this custom css

.sp-slider #sp-slider-item-1547104010652-num-0-key #sp-slider-inner-item-1547104010653-num-0-key{
  color:#1640d7 !important;
}

Add this css code inside the custom.css file.
Note: 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.
https://prnt.sc/pu705g
https://prnt.sc/pu70zn
In Extensions>Template> Template Options > Custom Code > Custom CSS please add this
Thanks

GABRIEL NB Asked this
5 years ago

*Hi Mehtaz, unfortunately I have to work with the Gantry 5 theme, which besides template is a framework, and it is a bit special, I think its CSS is modified differently. In any case your code worked, I entered it via SP Builder, in "styles", "CUSTOM" . I think this is not ideal, but for now it is the only thing I know how to do.

I wanted to ask you, I want to modify other colors. For this, how should I write the CSS? in this case, from the element inspector what I want to change is:

sppb-addon-1547104010652 .sp-slider.dot-controller-line .sp-dots ul li.active span {

background-color: #0b4c65;

}


#sppb-addon-1547104010652 .sp-slider .sp-dots ul li { background-color: #0b4c65; }
background-color: #030902;

}

(I have copied the correct changes from the element inspector)

Log in to reply.