Return to previous page

Header color, footer color, link color changes

This topic has 18 replies, 2 voices, and was last updated 7 years, 10 months ago ago by Eva Kemp

shivas-irons

Participant

January 17, 2017 at 06:33

I made a video walking through the changes I need to make and need clarification.

These are the needs expressed in the video:

https://www.dropbox.com/s/ncujpi5m10u2mx2/sitecolorchanges.mp4?dl=0

1. Change header color
2. change nav. color
3. change link color on nav.
4. change link hover color on nav
5. change link visited color on nav
6. change footer color
7. change footer text color
8. change footer social icons color
9. change text color on social icons

I can’t find a custom.css file to where I made the current settings to the colors to the list above. There is no code in the custom css field in the theme appearance area either.

Please, contact administrator
for this information.

#152060 Copied Theme version: royal

17 Answers
Eva Kemp

Support staff

January 17, 2017 at 11:04
Hello,

1. You can change header background color in Theme Options > Color Scheme > Header Background.

2./3./4./5. To change menu color go to Theme Options > Color Scheme > Menu Background.
To change links color use this code in Theme Options > Custom CSS > Global Custom CSS or add the code in your child theme style.css file:
```
.menu > li > a {
   color: #000;
}
.menu > li > a:hover {
   color: #000;
}
.menu > li.current-menu-item > a {
    color: #cda85c !important;
}
```
Change color values to yours.

6. You have this code for footer background color in child theme style.css:
```
.footer-top.footer-top-2 {
    background: #eee;
}
```
Change it there.

7. Use this css code:
```
.footer-top.footer-top-2 div {
    color: #fff !important;
}
```
8./9. Add this css code in child style.css:
```
.menu-social-icons i {
    background-color: white;
    color: black;
}
```
Change color values to yours.

Regards,
Eva Kemp.
#152093 Copied
shivas-irons

Participant

January 18, 2017 at 01:05

Much appreciated! Just a couple tweaks and I’ll be good see video:

https://www.dropbox.com/s/4azkxdpgdghza9v/adjustments.mp4?dl=0

BTW, I’ve since changed the site back to original until I have all details clear then will make all changes so if you go to live site you won’t see any changes mentioned in video.

#152188 Copied

shivas-irons

Participant

January 18, 2017 at 01:25

One other things: https://www.dropbox.com/s/9db3lrfvg8718se/firefoxissue.mp4?dl=0

#152190 Copied
Eva Kemp

Support staff

January 18, 2017 at 11:36
Hello,

1. As for the fixed header, you have this css code in child style.css file:
```
.fixed-header-area {
    background: #eee;
}
```
Change the background color there.
Use this code to change menu items color in the fixed header:
```
.fixed-header-area .menu > li > a {
   color: #000;
}
.fixed-header-area .menu > li > a:hover {
   color: #000;
}
.fixed-header-area .menu > li.current-menu-item > a {
    color: #cda85c !important;
}
```
2. To change sidebar color on home page you need edit this code in your child style.css:
```
.sidebar-right {
    padding: 14px;
    border: 1px solid #ddd;
    background: #eee;
}
```
Change background color.

3. To change bottom footer color please use this css code:
```
.main-footer {
    background: red !important;
}
```
Change to your color value.

Have you tried settings different color in this code in child style.css?:
```
.footer-top.footer-top-2 {
    background: #eee;
}
```
Regards,
Eva Kemp.
#152233 Copied
shivas-irons

Participant

January 18, 2017 at 22:22

Yes I tried the color changes as recommended. My video shows the issue seems to be with the style.css file as nothing I do in that file shows any changes on the site.

https://www.dropbox.com/s/4s1axgpwn740n0k/stylecss.mp4?dl=0

#152357 Copied

shivas-irons

Participant

January 18, 2017 at 22:24

FYI: I had changed all code back to original but my video shows my efforts in real time. I’ll await until I have everything ready and functioning before committing to all the changes.

#152358 Copied

Eva Kemp

Support staff

January 19, 2017 at 16:19

Hello,

May I make changes in your style.css file?
Please confirm.

Thank you.
Regards,
Eva Kemp.

#152464 Copied

shivas-irons

Participant

January 19, 2017 at 20:25

Yes, but just to test. Once you confirm your changes are working please return them to their original code.

I’ll finalize all changes once I know I can succeed. 🙂

#152491 Copied
Eva Kemp

Support staff

January 20, 2017 at 13:46
Hello,

Seems the styling is cached.
Please try to add !important to the code like here:
```
.footer-top.footer-top-2 {
    background:#000 !important;
}
```
and clear browser cache/cookies before checking.

Regards,
Eva Kemp.
#152584 Copied
shivas-irons

Participant

January 20, 2017 at 19:32

I had 95% success. Just the sidebar won’t happen. And I need some other code for the link colors on it as well. But here’s what’s happening real time:

https://www.dropbox.com/s/ykymz1vjobky1q9/sidebar-.mp4?dl=0

sidebar changes needed as well as main color change:

1. Link color
2. Link hover color
3. link visited color

Plus change the color of the very bottom footer at the bottom of the page on homepage.

#152616 Copied

shivas-irons

Participant

January 21, 2017 at 00:00

Have you been making adjustments? The site is down and there is a strange script showing when loading the url. It was working great when I was done. Just noticed it now when looking to see for your reply. Please respond with any info on changes you might have made. Urgent!

#152652 Copied

shivas-irons

Participant

January 21, 2017 at 01:18

Ignore previous message I’ve corrected things with my server.

Yet the purpose of the ticket remains regarding the sidebar, etc.

Feel free to tweak and I’ll watch for your reply.

#152656 Copied
Eva Kemp

Support staff

January 21, 2017 at 11:42
Hello,

I was able to change background color for sidebar using this code:
```
.sidebar-right {
    padding: 14px;
    border: 1px solid #ddd;
    background: #000 !important;
}
```
Change #000 to your color value and check in different browsers.

To change color for sidebar title, edit this code in your child style.css:
```
.sidebar-right .widget-title span {

background:#222;

color:#FFF;

}
```
To change links color use this css code:
```
.widget_nav_menu li a {
   color: #767676 !important;
}
.widget_nav_menu li a:hover {
   color: #767676 !important;
}
```
Use your color value.

Regards,
Eva Kemp.
#152676 Copied
shivas-irons

Participant

January 22, 2017 at 08:23

everything is looking great just one more piece of code needed 🙂

https://www.dropbox.com/s/i9gg9d7ez4aks1p/visitedcolor.mp4?dl=0

#152696 Copied
Eva Kemp

Support staff

January 23, 2017 at 20:16
Hello,

Please use this css code:
```
.widget_nav_menu li.current-menu-item a {
    background-color: #fff !important;
    color: #cda85c !important;
}
```
Change color values to yours.

Regards,
Eva Kemp.
#152841 Copied
shivas-irons

Participant

January 23, 2017 at 21:33

thank you I’m all set now. ticket closed.

#152854 Copied

Eva Kemp

Support staff

January 24, 2017 at 10:17

Hello,

You’re welcome.

Regards,
Eva Kemp.

#152897 Copied
Viewing 18 results - 1 through 18 (of 18 total)

The issue related to '‘header color, footer color, link color changes’' has been successfully resolved, and the topic is now closed for further responses

Header color, footer color, link color changes

Recent Topics

Helpful Topics

Useful links WooCommerce & WordPress

Browse by popular tags:

Explore our best WordPress WooCommerce Themes collection