How to change default colors for once and all?

Sparkling
#1

Hi,

Changing colors for different items not only takes time, but also leaves the risk of any item remaining unchanged and showing the original “default” color upon appearance. It just happened with me, I changed the colors but suddenly I stumbled upon a “Oops! Page not found error” and behold! The color of the error text was the default pinkish red one!

  1. Is there any way to set the “default” color scheme for once and all?
  2. If no, then how to change the color of the error 404 message?
  3. What’s the easiest way to change heading font?

Thanks a lot for the help coming!

#2

Hi @arslanzaidi,

I hope you are well today and thank you for your questions.

You can try setting default color scheme for all by adding the following CSS code in the Custom CSS option of the latest version of Sparkling theme on the below path.

Admin Area -> Appearance -> Customize -> Sparkling Options -> Other -> Custom CSS


#page h1,#page  h2,#page  h3,#page  h4,#page  h5,#page  h6,
#page .h1,#page.h2,#page .h3,#page .h4,#page .h5,#page .h6,
#page a, #page #secondary .widget a{color: #40bf40;}

#page a:hover, #page #secondary .widget a:hover{color: #405fbf;}

Please change the color value in the above code to whatever you want to use by referring the following pages.

http://www.w3schools.com/html/html_colors.asp
http://www.w3schools.com/html/html_colorvalues.asp
http://www.w3schools.com/tags/ref_colorpicker.asp

To help us keep support thread separates could you please create new thread for each of your other questions here https://colorlibsupport.com/c/sparkling/ instead of asking them in your single thread as it makes the thread messy and hard to read.

If you want to you can also add reference of this thread in your newly created thread.

We would be more than happy to help you on your new thread.

Best Regards,
Movin

#3

Thanks Movin for your help. But I found the solution already. Editing the stylesheet and replacing the concerned color with the desired one. Rest of the problems have also been solved by using some external CSS and plugins. I will keep in view the separate threads in case of any other queries. By the way the solution you gave just changes the font color, instead of the element colors.

Thumbs up for the great theme!

#4

You are most welcome here :slight_smile:

Please note if you make changes in the theme file then you have to make these changes again after theme updation as changes made in the theme files get lost on theme updation so we recommend to use the CSS code by adding it on the following path.

Admin Area -> Appearance -> Customize -> Sparkling Options -> Other -> Custom CSS

#5

o oooo!!! But Movin the problem is that overriding the default CSS separately seems quite tedious to me. Seems there are so many elements. In the original CSS there were around 35 entries which I had to change. I don’t know how to do all those via custom CSS. Secondly, I do not know which is left and which is not. Like I mentioned above that after doing much tinkering with colors, when I discovered the 404 page, it was still having the “default” color.

The code you mentioned above was not working.

Is it not possible that you give an option to CHANGE DEFAULT COLORS in the next upgrade? I think it will make this theme more awesome.

#6

yeah im wait for an option for change default colors to… hope it will come soon

#7
The code you mentioned above was not working.

Could you please share me the page URL from your site where it is not working correctly so that i can troubleshoot it?

Is it not possible that you give an option to CHANGE DEFAULT COLORS in the next upgrade? I think it will make this theme more awesome.

We have already provided some color options in the theme settings but requested theme developer to add more in the future versions of theme.

#8

The site is under construction. http://goforielts.com

The current color scheme, I made from the CSS (except header and footer). Because when I was just changing element colors, other things were popping out in the original colors (like the 404 error I mentioned earlier). If you could provide a custom CSS to maintain this color scheme then it will be better when theme gets the update.
The earlier code you provided was changing element font’s color not the elements’.

#9
The site is under construction.

It is of no use if your site is under construction. Would you mind if i log in to your site and then access it? If this is ok then could you please share me your site log in details privately by checking the option “Set as private reply” when replying to this topic?

The earlier code you provided was changing element font’s color not the elements’.

Do you meant the element text color but not the element background color?

Could you please share me the screenshot of the issue?

#10

username: generalguest
pw: guestview110

This guest has admin privileges.

See, the current color scheme is the one i need. the only color i changed is basically the red one. so if I could get an option to change this RED to for example Orange in future by just one click (replacing the color code in custom css), it would be awesome! right now, I have managed to get the red all over the site and it is working fine so far and i am happy with it.

Do you meant the element text color but not the element background color?
Yes. I removed the code now. So pardon the screenshots please.
#11

See in the attached screenshot i just temporary added the shared CSS code in the Cusotm CSS option of the theme and it worked fine.

#12

Hi Movin, thanks for your effort but, the code you are giving is changing the text color to green, the buttons are still red??

i think the best way to sort out this issue is that you have a fresh install of the theme at your side and try to match the color scheme of yours with mine via custom css. Then provide the final css code to me. I know its a bit of inconvenience, but i will be really thankful to you for this.

#13

Ok then try using the following CSS code instead of shared above.

#page .cfa-text,
#page h1,#page  h2,#page  h3,#page  h4,#page  h5,#page  h6,
#page .h1,#page.h2,#page .h3,#page .h4,#page .h5,#page .h6,
#page a, #page #secondary .widget a{color: #40bf40;}

#page a:hover, #page #secondary .widget a:hover{color: #405fbf;}

#page .cfa-button,
#page button,
#page a.btn.btn-default {
    background-color: #40bf40;
    border-color: #40bf40;
    color: #fff;
}
#page .cfa-button:hover,
#page .flexslider h2.entry-title,
#page button:hover,
#page a.btn.btn-default:hover {
    background-color: #405fbf;
    border-color: #405fbf;
        color: #fff;
}
#14

Dear Movin,

I am very thankful for your support. However, just a humble request is that since I do not wish to mess around with the code again as I have set the theme according to my taste with much trouble, it will be easier for you to test the code as I am sure you will be having multiple virtual machines and installation environments for your themes. Just a request, that you send me the final code after testing and matching the color scheme with my site??

#15

@arslanzaidi

You are most welcome here :slight_smile:

Actually i can’t develop the CSS code just guessing, i have to test it on my to check whether it is working or not.

If you still hesitate to use it then let it be and use the current solution you are using on your site but just don’t update your theme orelse the changes you have made in the theme files will get lost.