Background color outside of the template

I am looking into this website for a group I am in, trying to “advise” them. I have no coding experience at all. I have designed some web sites but hired out to build them. This one I want to change the outside background, the gold part to white to match the rest of the site, and take out the blue line under the nav bar, but can’t find it in the view source. I have searched all “background” colors in the info but can’t find the outside color, gold. Even searched by the hex color. Is the outside of the template called something other than background? Like pasteboard or?

How hard is this? I have several other changes I would like, to line up the columns etc.

Is this site built in WordPress? The background colors would be associated with a class in one of the associated CSS files (which won’t be visible in a simple look at the source since the CSS resides in separate files referenced from within the HTML source). Where, exactly, might depend on the theme and how it’s built. That color is definitely part of the theme, though.

The blue line might be a border-bottom on a DIV associated with the menu, but there are several ways to make something like this, but it’s almost certainly a combination of an HTML element and a CSS class that’s been assigned to it spelling out the thickness of the line and its color.

1 Like

Hanks B! Yes it is a Wordpress “Woo” theme hosted by godaddy. I did look through the Woo theme source too and didn’t find it under background.

Is this going to be big job? Just to change the gold background to white?

I will have to get some help.

Skipping through the technical jargon as much as possible, If you look at the source, toward the top, between the head tags, you should see links to css files. Somewhere in those files will be where the background hexadecimal color is specified.

That color will be part of a class that’s likely associated with a container div in the HTML

In any case, you’ll need to make the change in the CSS file once you locate the problem. The same general principle is true of tracking down the issue with blue line.

If you’re using Chrome, instead of looking at View Source, look at the Developer Tools item associated with it. There you will see what is, essentially, the source HTML file with the ability to experiment with various parameters associated with the page. Clicking the different page elements will cause their associated CSS classes and various attributes (including hex values) to be displayed beneath the source code in a separate box.

You can actually change those values to see what effect doing so has on the page. This makes a good way to locate a problem before heading into the server files, tracking down the CSS and making the permanent fix.

Sounds complicated, I know. If you want to send me a link to the actual page, I can open the developer tools and try to track down the location problem myself (no charge). I don’t need access to the server or anything like that. I’m not familiar with the Woo Theme, but there’s also the possibility of it using a stylesheet technology known as LESS instead of straight CSS. If that or something similar is going on, it gets more complicated.

1 Like

Post the link and we can give you the lines of markup you need to change.

1 Like

Sent you a private message.

©2019 Graphic Design Forum | Contact | Legal | Twitter | Facebook