Change Background (Education theme)

Community Forums Forums Design Tips and Tricks Change Background (Education theme)

This topic is: not resolved

This topic contains 3 replies, has 3 voices, and was last updated by  hmclean 1 year, 10 months ago.

Viewing 4 posts - 1 through 4 (of 4 total)
  • Author
  • #80902


    Hi guys,

    Quick question–so I have the Education theme. The theme comes preset with about 5 colors–red, blue, teal, etc.

    I have two questions:

    1) How can I change the color of the background to a color that’s not one of the pre-set ones? So if I wanted to change the background to a orange or grey or brown–how could I go about doing that? Using the “Inspect Element” option in Google Chrome, it looks like there’s a colored jpg that’s creating the background color. Do I need to make my own jpg, color it and save it, and then somehow upload it? Or is there a different way to fix this? Any help would be great.

    2) Whenever you change the default background color, it also changes the link color. So if I change my background color from teal to red, it also changes the links from teal to red.

    So my question is this–if I’m able to successfully change the background color of the education theme to, say, gray, is there a way I can customize my site so that the link colors DON’T turn gray, too?

    In other words, can I tweak my site so that I can have a custom background color of gray and a link color of, say, brown? And if so, how would one go about doing that?

    I have already made some CSS changes to my site–I’m not an expert but not a total novice either. But I do need some help with this particular task.

    Thanks everyone!



    Hi PacMan3000,

    To change the background you need to update the following code. You will either need to create a new image and upload it via FTP over the previous one OR change the background to a flat color eg #999999. This is assuming that you have the default color scheme chosen (If you want to customize with your own colors, I would recommend you set it to default).

    #inner {
    	background: url(images/bg-top.jpg) repeat-x top;
    	clear: both;
    	padding: 40px 0 20px;
    	overflow: hidden;

    To change your hyperlink colors, edit the color: in this code.

    a:visited {
    	color: #34678a;
    	text-decoration: underline;

    Need website customization services or other help? Caley @ PixelPerfect Design Studio | Connect with me on Twitter: @pixelsperfect | Like me on Facebook:



    In themes that have several color schemes where I want to change some or all of the colors, I usually copy the css styles from one of the color schemes, name it something like “My New Color Scheme” and add it to the CSS file. From there I change the colors as needed. The new color scheme shows up in the dropdown Color Style menu in the Genesis Settings.



    I forgot a step in the above reply regarding changing color schemes – the new color scheme has to be registered in the functions.php file. An excellent tutorial is here:

Viewing 4 posts - 1 through 4 (of 4 total)

You must be logged in to reply to this topic.