Forums / Templates, Stylesheets, Page Layout / Header change according to category

Header change according to category

Locked

Started by cregy on 23 Feb 2007, 4:38 PM · Views: 8,670

Results 21 to 32 of 32
This thread is locked. New replies are disabled.
18 Jan 2008, 3:41 PM
#21
rengoku avatar

rengoku

New Zenner

Join Date:
Jan 2008
Location:
US
Posts:
5
Plugin Contributions:
0

Header change according to category

Could someone please tell me where I am messing up at? I have went through and made all the modifications as stated... but the logo in the header.php file under /includes/languages/english/ seems to be overriding the /includes/templates/template_default/common/

here is what I’ve got so far...

<!--bof-branding display-->
<?php
unset($logo_cpath);
$logo_cpath[] = "1";
$logo_cpath[] = "1_3_8";
$logo_cpath[] = "1_3_9";
$logo_cpath[] = "1_5_10";
$logo_cpath[] = "1_5_11";
$logo_cpath[] = "1_6_12";
$logo_cpath[] = "1_6_13";
$logo_cpath[] = "1_7_14";
$logo_cpath[] = "1_7_15";
$logo_cpath[] = "16";
$logo_cpath[] = "17";
$logo_cpath[] = "18";
/* add as many $logo_cpath[] = "..."; as you want */
?>
<div id="logoWrapper<?php if (array_search($_REQUEST['cPath'], $logo_cpath)) { echo '_' . $_REQUEST['cPath']; } ?>">

CSS

#logoWrapper_1{
	background-image: url(../images/logo_black.gif;
	background-repeat: repeat-x;
	background-color: #FFFFFF;
	height:150px;
	}
	
#logoWrapper_1_3_8{
	background-image: url(../images/logo_wb.gif;
	background-repeat: repeat-x;
	background-color: #FFFFFF;
	height:150px;
	}
	
#logoWrapper_1_3_9{
	background-image: url(../images/logo_wp.gif;
	background-repeat: repeat-x;
	background-color: #FFFFFF;
	height:150px;
	}
	
#logoWrapper_1_5_10{
	background-image: url(../images/logo_blue.gif;
	background-repeat: repeat-x;
	background-color: #FFFFFF;
	height:150px;
	}
	
#logoWrapper_1_5_11{
	background-image: url(../images/logo_pink.gif;
	background-repeat: repeat-x;
	background-color: #FFFFFF;
	height:150px;
	}
	
#logoWrapper_1_6_12{
	background-image: url(../images/logo_blue.gif;
	background-repeat: repeat-x;
	background-color: #FFFFFF;
	height:150px;
	}
	
#logoWrapper_1_6_13{
	background-image: url(../images/logo_pink.gif;
	background-repeat: repeat-x;
	background-color: #FFFFFF;
	height:150px;
	}
	
#logoWrapper_1_7_14{
	background-image: url(../images/logo_red.gif;
	background-repeat: repeat-x;
	background-color: #FFFFFF;
	height:150px;
	}
	
#logoWrapper_1_7_15{
	background-image: url(../images/logo_purple.gif;
	background-repeat: repeat-x;
	background-color: #FFFFFF;
	height:150px;
	}
	
#logoWrapper_16{
	background-image: url(../images/logo_white.gif;
	background-repeat: repeat-x;
	background-color: #FFFFFF;
	height:150px;
	}
	
#logoWrapper_17{
	background-image: url(../images/logo_green.gif;
	background-repeat: repeat-x;
	background-color: #FFFFFF;
	height:150px;
	}
	
#logoWrapper_18{
	background-image: url(../images/logo_salmon.gif;
	background-repeat: repeat-x;
	background-color: #FFFFFF;
	height:150px;
	}

I appreciate any help anyone can offer!

18 Jan 2008, 10:19 PM
#22
rengoku avatar

rengoku

New Zenner

Join Date:
Jan 2008
Location:
US
Posts:
5
Plugin Contributions:
0

Re: Header change according to category

Just a quick update... i noticed that i forgot to include the ending ")"

#logoWrapper_1{
background-image: url(../images/logo_black.gif);
background-repeat: repeat-x;
background-color: #FFFFFF;
height:150px;
}

But the Header.php under the /includes/languages/english/ still over rides the back pages from generating the logo like it should.

20 Jan 2008, 4:14 AM
#23
testuser avatar

testuser

Inactive

Join Date:
Oct 2004
Location:
Houston, TX
Posts:
792
Plugin Contributions:
0

Re: Header change according to category

Rengoku:

Just a quick update... i noticed that i forgot to include the ending ")"

#logoWrapper_1{
background-image: url(../images/logo_black.gif);
background-repeat: repeat-x;
background-color: #FFFFFF;
height:150px;
}

But the Header.php under the /includes/languages/english/ still over rides the back pages from generating the logo like it should.

If your adjusting template files, can I ask why your in the languages folder?

Most commonly the header file for the template structure is located under:

includes/templates/YOUR_TEMPLATE/common/tpl_header.php

which would associate with this stylesheet:

includes/templates/YOUR_TEMPLATE/css/stylesheet.css

Oh one more thing, you left off the ")" on every definition ... just in case you didn't notice.

Colin @ iChoze Internet Solutions
Zen Cart Stuff powered by Zen Cart
http://zen-cart-templates.ichoze.net

20 Jan 2008, 4:15 AM
#24
testuser avatar

testuser

Inactive

Join Date:
Oct 2004
Location:
Houston, TX
Posts:
792
Plugin Contributions:
0

Re: Header change according to category

Post duplicated ...

Colin @ iChoze Internet Solutions
Zen Cart Stuff powered by Zen Cart
http://zen-cart-templates.ichoze.net

20 Jan 2008, 6:47 AM
#25
rengoku avatar

rengoku

New Zenner

Join Date:
Jan 2008
Location:
US
Posts:
5
Plugin Contributions:
0

Re: Header change according to category

If your adjusting template files, can I ask why your in the languages folder? Ummm... am I not suppose to edit the files there??? I have a multi-lingual cart... Japanese and English so I needed to make some adjustments in the header files under these languages... would it fix the problem if I restored these files and only edited the ones you mentioned?

after I posted my question... I noticed that I forgot the end bracket :) so I fixed that and posted that I changed that... but thanks for the catch!

20 Jan 2008, 9:33 PM
#26
testuser avatar

testuser

Inactive

Join Date:
Oct 2004
Location:
Houston, TX
Posts:
792
Plugin Contributions:
0

Re: Header change according to category

Rengoku:

If your adjusting template files, can I ask why your in the languages folder? Ummm... am I not suppose to edit the files there??? I have a multi-lingual cart... Japanese and English so I needed to make some adjustments in the header files under these languages... would it fix the problem if I restored these files and only edited the ones you mentioned?

after I posted my question... I noticed that I forgot the end bracket :) so I fixed that and posted that I changed that... but thanks for the catch!

What your trying to do would only need to affect the template files unless of course you want language specific, template files wherein your design actually changes by language.

By idea, the language files contain almost no templating functions ... most template files can be identified by the prefix "tpl_" ... so if your trying to use the language files to control your templating you could be throwing junk into the mixer as the language files get loaded early.

Now if your there editing how different text appears in different languages, I'd say your there for the right reason.

To be editing the layout of your header the file you should be editing should be this file or something similar:

includes/templates/YOUR_TEMPLATE/common/tpl_header.php
or
includes/templates/template_default/common/tpl_header.php

If you use the second one I'd recommend copying that file into your template folder so the path looks like the first one. Of course YOUR_TEMPLATE is replaced with the name of your actual template folder.

Colin @ iChoze Internet Solutions
Zen Cart Stuff powered by Zen Cart
http://zen-cart-templates.ichoze.net

22 Jan 2008, 7:36 AM
#27
testuser avatar

testuser

Inactive

Join Date:
Oct 2004
Location:
Houston, TX
Posts:
792
Plugin Contributions:
0

Re: Header change according to category

Rengoku:

If your adjusting template files, can I ask why your in the languages folder? Ummm... am I not suppose to edit the files there??? I have a multi-lingual cart... Japanese and English so I needed to make some adjustments in the header files under these languages... would it fix the problem if I restored these files and only edited the ones you mentioned?

after I posted my question... I noticed that I forgot the end bracket :) so I fixed that and posted that I changed that... but thanks for the catch!

And here's the way you should be doing this.

Style your #logoWrapper the way you'd like it to appear over the majority of your site (or the default style) in your "stylesheet.css" file.

Then, for each category that you want it to be unique ... create a stylesheet associated to the category and include changes to the default #logoWrapper ID.

Below is an example and naming scheme for two different categories, the number is virtually unlimited so get creative.

:shocking: **You could really have a different look, different design for every category! **:shocking:


Example:

We're gonna want different images to appear in the logo for category 12 & category 1.

The following would be in your main stylesheet definitions -> stylesheet.css

/*Exert from main stylesheet - from classic template
stylesheet.css*/

#logoWrapper{
    background-image: url(../images/header_bg.jpg);
    background-repeat: repeat-x;
    background-color: #ffffff;
    height:75px;
    }
```For category 12 we'd create this file -> **c_12.css**
And it would contain the following:

/Change #logoWrapper for Category 12 - Different Background Image/
#logoWrapper{
background-image: url(../images/header_bg_cat12.jpg);
background-color: #000000;
height:85px;
}


Now for Category 1 we're going to want a solid background so we'd do the following.  
Create another file -> **c_1.css **
It would contain the following:

/Change to #logoWrapper for Category 1 - Solid Background/
#logoWrapper{
background-image: none;
background-color: #990000;
height:105px;
}


> includes/templates/YOUR_TEMPLATE/css/If there are any questions, please feel free to ask.

Colin @ iChoze Internet Solutions
Zen Cart Stuff powered by Zen Cart
http://zen-cart-templates.ichoze.net

25 Jan 2008, 9:26 PM
#28
femky avatar

femky

New Zenner

Join Date:
May 2006
Posts:
24
Plugin Contributions:
0

Re: Header change according to category

I have been trying to change the color of the #navCatTabsWrapper for the different categories in my sites and by creating c_1.css and other extra template files it went fine for the first level of categories.

I am however working with (sub)categories in (main)categories before the product listing starts. I thought that by creating the basis category template c_1.css and so on, all categories and pages in that main category would end up with the c_1.css changes. Kind of like a theme for a product range.

Do I really need to create a separate c_??.css for all different categories and productlisting pages? Even thought for 1 product range (1 main category + 3 subcategories with their product pages) the changes are the same?

Thanks in advance!

26 Jan 2008, 1:56 AM
#29
testuser avatar

testuser

Inactive

Join Date:
Oct 2004
Location:
Houston, TX
Posts:
792
Plugin Contributions:
0

Re: Header change according to category

femky:

I have been trying to change the color of the #navCatTabsWrapper for the different categories in my sites and by creating c_1.css and other extra template files it went fine for the first level of categories.

I am however working with (sub)categories in (main)categories before the product listing starts. I thought that by creating the basis category template c_1.css and so on, all categories and pages in that main category would end up with the c_1.css changes. Kind of like a theme for a product range.

Do I really need to create a separate c_??.css for all different categories and productlisting pages? Even thought for 1 product range (1 main category + 3 subcategories with their product pages) the changes are the same?

Thanks in advance!

You'd need to include a stylesheet whenever you want to override the style that's in the main stylesheet.

When you create the files such as c_1.css they're loaded after the main stylesheet so it's basically overriding what's in that stylesheet.

So to answer your question ... the answer is yes. The good thing is, the stylesheet doesn't have to be 1500 lines, it could be as little as one to make the change you need.

Colin @ iChoze Internet Solutions
Zen Cart Stuff powered by Zen Cart
http://zen-cart-templates.ichoze.net

28 Apr 2008, 8:22 PM
#30
lkzone avatar

lkzone

New Zenner

Join Date:
Jan 2008
Location:
Georgia
Posts:
68
Plugin Contributions:
0

Re: Header change according to category

I successfully used the code change some time ago to have different headers for each category.

Today I removed all items from a category, created new subcategories and then re-entered my products.

However when I view the page now for this "c-path" my header is completely missing. Any ideas?

Thx

22 May 2008, 5:19 AM
#31
dscott1966 avatar

dscott1966

Zen Follower

Join Date:
Apr 2005
Posts:
298
Plugin Contributions:
0

Re: Header change according to category

I have went through the steps at the begining a few times and it still does not work for me. Can i get some input on what im doing wrong.

Can be seen here: http://www.dealz-r-us.com im trying to get it to change for women for now more to come later need to get it to work for that first.

also im using black gloss template.

Thank you

23 May 2008, 7:11 PM
#32
seamstobesew avatar

seamstobesew

Zen Follower

Join Date:
Nov 2005
Location:
Germany
Posts:
110
Plugin Contributions:
0

Re: Header change according to category

What a cool trick, am gonna keep this category just as a reference.

Fabulous, Fabulous, Fabulous. I've often been asked if this was possible and always said I doubt it.

Thank you for sharing that idea.

Marian
http://www.seamstobesew.com
Tip: Always place your zen-cart version in your messages.