Forums / Basic Configuration / Changing The Color In A Sidebar Header

Changing The Color In A Sidebar Header

Results 1 to 5 of 5
24 May 2012, 13:18
#1
scully avatar

scully

Zen Follower

Join Date:
Dec 2010
Posts:
257
Plugin Contributions:
0

Changing The Color In A Sidebar Header

I saw in another post that I should change the color of a sidebar header by modifying the stylesheet_boxes.css. I'd have asked my question there, but it was a closed thread.

Where do I find the stylesheet_boxes.css? I downloaded the entire zencart to my PC and did a search for it, but I don't have that file.

The site is http://www.cocosinthevillage.com/zencart. She wanted a real eye-bleeder, so I started with the Candy template and have been modifying it to match her logo colors.

While I'm thinking about it, I'd like the middle stripe in the border to be different from the background. The stylesheet.css code snip is:

/*wrappers - page or section containers*/
#mainWrapper {
background-color:#479855;
text-align: left;
width: 950px;
vertical-align: top;
border: 25px double #FF8040;
/*background-image: url(../images/greengrad1.jpg);*/
}


479855 is the green, FF8040 is the orange. If I leave the background image commented out, the entire thing is dark green (479855). If I uncomment the background image, the gradient green shows up (as it is now) but I lose the middle stripe of the border. It seems to read either the background-color or the background-image, but not both. Is there a way to make it read both?

Oh, and one last quick question (if I don't post it here, I'll forget it)...the Candy template is just slightly larger than screen-width. Where do I modify it to bring it back to 100% screen width, so that it doesn't overflow to the right?

Thanks very much for your help!
24 May 2012, 13:39
#2
stevesh avatar

stevesh

Black Belt

Join Date:
Feb 2005
Posts:
19,793
Plugin Contributions:
2

Re: Changing The Color In A Sidebar Header

The template width seems right here (no horizontal scroll, anyway).

The thread you read must have been referring to a commercial template. There's no stylesheet_boxes.css in the stock or most custom templates. You're looking for this in stylesheet.css:

.leftBoxHeading, .centerBoxHeading, .rightBoxHeading {
margin: 0em;
background-color: #ff00ae;
/*background-image: url(../images/candy2.jpg);*/
padding: 0.5em 0.2em;
}

BTW, Zencart loads all stylesheets with the css extension it finds in the current template's css folder, so if you need to leave the old stylesheet there, rename it stylesheet.old.
24 May 2012, 13:45
#3
scully avatar

scully

Zen Follower

Join Date:
Dec 2010
Posts:
257
Plugin Contributions:
0

Re: Changing The Color In A Sidebar Header

Oh, believe me, the first thing I did was rename the original! LOL Made that mistake the first time out, not gonna make it again!

Okay, I changed the code from

background-color: #ff00ae;

to

background-color: #479855;

but it didn't make any difference.
24 May 2012, 14:04
#4
stevesh avatar

stevesh

Black Belt

Join Date:
Feb 2005
Posts:
19,793
Plugin Contributions:
2

Re: Changing The Color In A Sidebar Header

Yes it did, at least here. They're green now.

As I said, you changed the name of the old stylesheet to stylesheet_old.css, which means it's still being loaded. Change it to stylesheet.old, or, better, move it to a different folder.
24 May 2012, 14:11
#5
scully avatar

scully

Zen Follower

Join Date:
Dec 2010
Posts:
257
Plugin Contributions:
0

Re: Changing The Color In A Sidebar Header

Oh, I see. That changed the sidebox header colors. LOL I was looking at the borders. :blush:

Okay, now that you solved the first problem, how can I change the borders? I was able to change the double border to orange...I'd like to change the inner border to dark green while keeping the gradient image in place. Is that possible? Do I need to move the gradient image to another spot?

THANK YOU!!