Different header for different product categories possible?

Hi all ^^

Im having a problem with this... I have full html layout of our webstore ready and our header changes depending on category of products. Is it possible to implement this to zen cart too?

I tried to just not use any layout in header, footer and just build the whole page with for example "tpl_index_default.php" file. This works fine with just static pages, but when trying to do this in product listinings it becomes troublesome.

Like you see im new with zen cart ^^;;

Thanks for advance!

• Rotkale

You can use "per page stylesheets" to accompliish this.

clydejones:

You can use "per page stylesheets" to accompliish this.

Thanks for fast reply. This works even when working with images?

Yep,

for instance in the stylesheet.css you use for for your main page you have this declaration:

#logoWrapper {
background: url(../images/your_main_image.jpg);
}

now create a stylesheet for category one and change it:

the stylesheet would be named c_1.css and would place this declaration along with any others you might need to style the page.

#logoWrapper {
background: url(../images/category_one_image);
}

clydejones:

Yep,

for instance in the stylesheet.css you use for for your main page you have this declaration:

#logoWrapper {
background: url(../images/your_main_image.jpg);
}

now create a stylesheet for category one and change it:

the stylesheet would be named c_1.css and would place this declaration along with any others you might need to style the page.

#logoWrapper {
background: url(../images/category_one_image);
}

Thanks alot! I start trying that ^^

Hmmm,

I edited stylesheet.css and took #logoWrapper off the line it was earlier:

#headerWrapper, #contentMainWrapper, #logoWrapper, #cartBoxListWrapper, #ezPageBoxList, #cartBoxListWrapper ul, #ezPageBoxList ul, #mainWrapper, #popupAdditionalImage, #popupImage {
margin: 0em;
padding: 0em;
}

and made new section like this:

#logoWrapper {
background: url("Images/header_covington.jpg");
}

I tried that also without the ""
and put this in middle of html section of the header file:

But my header image wont appear at all ^^;; What am i doing wrong?

Oh i found solution for that problem above by using the full url (http://www.mysite.com/images/etc...)

Here is another question about header, in our layout we have jscript like this on header:

Is there anyway to use this kind of jscript header on product categories? Main site uses just static header like with code like i showed above.

Thanks in advance~

and made new section like this:

#logoWrapper {
background: url("../Images/header_covington.jpg");
}

You forgot the portion highlighted in red

clydejones:

and made new section like this:

#logoWrapper {
background: url("../Images/header_covington.jpg");
}

You forgot the portion highlighted in red

Yeah i tried that too, but i only got it work with full url. My images folder is in store root.

About the question i asked above, the jscript random image thing, can i use category #logoWrapper to point to an js file? So the header image would change randomly like in the code i showed above? Or is there any other way to make it work?

Thanks~

Sorry, I don't use the random image contribution so I can't give you any kind of definitive answer on its ins and outs.

Found solution for the random header thing (if anyone interested~)

Used Clyde's category css example and put #logoWrapper like this:

#logoWrapper {
background: url(../Images/c_1/rotate.php);
}

Rotate.php code can be found from:

http://photomatt.net/scripts/randomimage

Thanks again Clyde for help~