Zen Cart Logo

Sidebox styling

Views: 621

Results 1 to 2 of 2
23 Nov 2011, 9:00 PM
#1
gazag avatar

gazag

Zen Follower

Join Date:
Jun 2011
Posts:
195
Plugin Contributions:
0

Sidebox styling

I have certain sideboxes that **ONLY **show on the home page and the rest DO NOT SHOW on the homepage.
(as per http://www.zen-cart.com/forum/showthread.php?p=1081490#post1081490)

The sideboxes that show up on the home page don't have any border or heading on them

Is there anyway to make the ones that **DO NOT **Show on the home page have a border around them when they show up on other pages?

At the moment i have just commented out the border part of the css which makes all sideboxes have no border or header!

24 Nov 2011, 9:40 AM
#2
schoolboy avatar

schoolboy

Totally Zenned

Join Date:
Jun 2005
Location:
Cumbria, UK
Posts:
10,327
Plugin Contributions:
0

Re: Sidebox styling

You need to use the zencart feature for PAGE-SPECIFIC stylesheets.

By editing stylesheet.css , your changes will be GLOBAL, so you have to "reverse" your approach.

If you want an exclusive set of styles on your HOME PAGE, then you will create a stylesheet called index_home.css

... and in THAT stylesheet, you will configure declarations that remove (or add) styles you want.

This stylesheet will be called ONLY when the homepage is on show, and it will also be called AFTER stylesheet.css, thereby making declarations inside it OVER-RIDE earlier declarations in the main stylesheet.

Style declarations are called in CHRONOLOGICAL order, and the browser will apply the LAST-FOUND style. So if you were to have the following in ANY stylesheet...

H1 {color: #ff0000;} (red)

H1 {color: #000000;} (black)

The browser will see that RED has been surpassed by the next declaration for the same element, and will therefore ignore H1=RED and will apply H1=BLACK.

After creating the new stylesheet, just FTP it to the css folder in the template you are using.