change the background of Header, Socket and Footer?

Hi,

As you’re using the SweetDate Child theme your CSS modifications should go into WP Admin > Appearance > Editor > SweetDate Child > Style.css, but they will work also in the Quick CSS of Theme Options.

You can try the below CSS to change the colors for the highlighted objects

/* Menu CSS */
.page-id-13067 .header-color.social-header, .page-id-13067 .header-color .top-menu li > a {
    border-color: white;
}
.page-id-13067 .kleo-main-header.header-extras {
    border-bottom-color: white;
}
.page-id-13067 .navbar a {
    color: white !important;
}

/* Footer CSS */
.page-id-13067 #footer .widget-title {
    color: white;
}
.page-id-13067 .footer-color .widget_nav_menu li a {
    border-color: white;
}
.page-id-13067 #footer li a {
    color: white;
}
.page-id-13067 #footer p, .page-id-13067 #footer label {
    color: white;
}

You can generate the CSS for yourself by right click the item and inspecting with Google Chrome DevTools to reveal the class/ID – add .page-id-13067 before anything you generate.

Thanks,

Kieran

Hi,

No worries, this tutorial may be helpful if you’re interested in learning to use Google Chrome DevTools.

All the best,

Kieran

Hi Alex,

Sorry, I had assumed that you were running Windows/Chrome as that is the most common. Mac/Safari does have a development tool, but is indeed different to Google Chrome’s DevTools – though essentially the function is the same.

I don’t personally use Mac/Safari so I don’t have any basic tutorial to hand for you but you will almost certainly find beginner friendly tutorial videos on YouTube for Safari development tools.

Thanks,

Kieran