The css rule to change it is
#main{
background-color:<<your color >>;
}
this can be placed in a custom css plugin or added to the style.css file in your child theme.
you can use a color picker to select the color like this one
color picker
Thanks mrtom414. I don’t know how to find the style.css file in your child theme. I only see the style.css of the Spacious theme. I also don’t know which css plugin to install where. I’m really new to this like 2 weeks.
in your control panel you should have jetpack.
Look under the settings options.
Activate the custom css option. You should then see an edit css option under Appearance.
Select Edit css and copy the code into it. Press the Save style button to save your changes.
Be sure to change the color.
In my Control panel under Settings there are just the usual General, Writing, Reading, Discussion etc. I looked inside ea. of them but no jetpack. Does it come with ea. site? thanks for being so patient.
Hi,
Jetpack is not installed by default, but you can install it, or a custom CSS plugin to allow you to make CSS changes. Here’s info on how to install a plugin:
https://codex.wordpress.org/Managing_Plugins#Installing_Plugins
https://codex.wordpress.org/Plugins_Add_New_Screen
Hope this helps!
Thank you I installed JetPack. Now I have to look for the information that mrtom414 provided.
Hello mrtom414:
I did the CSS Edit and coded
#main{
background-color: #ffffe6;
}
and saved it but nothing happened to my pages?
is it normal for the CSS Stylesheet to be empty?
Hi,
Your theme’s style sheet isn’t empty, if it were, you wouldn’t have any styles on your site (it would be naked HTML). I do not see the style you last mentioned, so it looks like something didn’t save quite right with that. Try adding it back in again as custom CSS in Jetpack and save your change.
Let us know if the style saves this time.
If I go to Jetpack and then Setting and then click Custom CSS the following shows
The Custom CSS editor gives you the ability to add to or replace your theme’s CSS, all while supplying syntax coloring, auto-indentation, and immediate feedback on the validity of the CSS you’re writing.
To use the CSS editor, go to Appearance → Edit CSS.
then when I go to Appearance Edit CSS the Screen shows the Screen has to Links Beginner Tutorial and Themes and Template Forum
underneath a note: Note: Custom CSS will be reset when changing themes.
and then the initial empty CSS File that I filled with the code
/*
#main{
background-color: #CC66FF;
}
*/
Have no idea!
sorry it should be – the Screen has Two Links “beginner Tutorial” and “Themes and Template Forum”
Hi,
Put your custom CSS below the */ and it will work.
The /* and */ are the beginning and ending of CSS comments which are for notes, anything entered between those is not interpreted by the browser. In case you want some more info on CSS comments:
https://css-tricks.com/snippets/css/comments-in-css/
https://developer.mozilla.org/en-US/docs/Web/CSS/Comments
It did work. Thank you so much.
I’m going to look at the links you sent and I also will try to take a Utube course on CSS.
When I entered #main{…………}
That refers to some CSS coding in the Spacious Style Sheet, correct?
Ulf
Hi,
#main is the id of a div on your site 🙂
Here’s some more more CSS resources to help you begin your journey:
https://codex.wordpress.org/Know_Your_Sources#Learning_CSS
I’m glad your style is working for you now!
