Categories Dressing

[gjh42]

You can even strip some more off of what you posted. This will do all the job you appear to be wanting:

.catBoxHeading1 {
    font-family: arial,verdana,helvetica, sans-serif;
    font-weight: bold;
    font-size: 1em;
    color: #00FF00;
    margin-top: 2px;
    margin-bottom: 2px;
    }

[Relentless]

Do I put the Mod Re: Categories Dressing, includes in /public_html [root?]
------------
This is tpl_categories.php --- is this correct.
---
case '28': //replace number with your desired cPath
//$content .= '<hr class="catBoxDivider" />' . "\n"; // to add divider uncomment this line
$content .= '<span class="catBoxHeading1">' . (file_exists(DIR_WS_TEMPLATE_IMAGES .
'cathead' . $current_path . '.gif') ? zen_image(DIR_WS_TEMPLATE_IMAGES . 'cathead' . $current_path . '.gif') .
'</span>':'Air Conditioning<br />Split System<br />Ducted</span>' . $disp_block_head) . "\n";
break;
case '34': //replace number with your desired cPath
//$content .= '<hr class="catBoxDivider" />' . "\n"; // to add divider uncomment this line
$content .= '<span class="catBoxHeading1">' . (file_exists(DIR_WS_TEMPLATE_IMAGES .
'cathead' . $current_path . '.gif') ? zen_image(DIR_WS_TEMPLATE_IMAGES . 'cathead' . $current_path . '.gif') .
'</span>':'Split System AC<br />Heat Pumps<br /> Ducted</span>' . $disp_block_head) . "\n";
break;
}
case '28': and case '34': are the categories ID of the categories,
that I would like the Headings to appear above,
if I understand the changes to tpl_categories.php correctly.

[gjh42]

That is correct.

You can upload the /includes/ folder to /public_html/, or just upload tpl_categories.php to /includes/templates/your_template/sideboxes/tpl_categories.php if you prefer.

[Relentless]

Glenn
Your Categories Dressing Mod, worked, first time, out of the box.
with the simple, addition of <br /> to all Category names,
and [Headings text in tpl_categories.php],
to put the Headings, and links on there own lines.

Headings text in, tpl_categories.php]
Air Conditioning <br />
Split Systems <br />
Ducted <br />
In Catalog= Category/Products
Category name
1 to 2 Tons <br />

Thank you for your help

[gjh42]

It is designed to use "block" display (allowing for such things as a colored background, box or button of uniform appearance), which by default disables the built-in stock <br /> tags, and uses the CSS in the example stylesheet.

If you wish not to have block-style display, just edit tpl_categories.php to uncomment the two lines for $disp_block and $disp_block_head as the readme instructs. (You will still need the <br /> tags between the parts of a heading:

Air Conditioning <br />
Split Systems <br />
Ducted

)

[Funkmanusa]

Great MOD, I really appreciate the contribution.

I have everything working except the category image headings.

I have the correct lines uncommented in the stylesheet_categories_dressing.css
and the images uploaded. The tpl_categories.php has been overwritten.

The image swap from your mod is working perfectly, but the images for the
category heads do not appear?

Any suggestions as to where I messed up?


Heres a link to my poor cart in progress:
http://www.citysatchel.com/zen-cart/

[gjh42]

You have an expanded categories mod installed, which gives you a different id than #categories:

<!--// bof: chcategories //-->

<div class="leftBoxContainer" id="chcategories"

I think if you edit the stylesheet, replacing #categories with #chcategories in Cat Dressing areas, you will see your images.

[lmw1]

Can somebody Pleeeese explain to me in detail how to accomplish this? I am using the Categories Dressing Mod. Nothing else.

*See attached image.

Thanks in advance!
Len

[gjh42]

From your previous posts, the "Body Jewelry" and "Hip-Hop Jewelry" are top categories, not static headings. This function is not covered by Categories Dressing. I see now that you have eliminated all the custom categories styling you had, and also changed around the category arrangement, making everything top cats. I can't properly give advice when I don't know how your categories will end up. If you rearrange things the way they were, reinstall the expanded categories mod you had, and follow the advice in Static Category Headings? Link header to main page?, post #10, about tags, I will give you code that will do the job. There are at least two ways to do it, depending on how your categories are arranged.

[Funkmanusa]

You have an expanded categories mod installed, which gives you a different id than #categories:

<!--// bof: chcategories //-->

<div class="leftBoxContainer" id="chcategories"

I think if you edit the stylesheet, replacing #categories with #chcategories in Cat Dressing areas, you will see your images.

Thanks for the reply GJH, I didnt even think about the expanded categroies being installed, I was using the mod and decided against using it, but forgot it was still in there.

I tried your suggestion modifying everthing in the stylesheet_categories_dressing.css file as described, but it didnt work for me.

Heres the modified css

/**
* CSS Stylesheet for Categories Dressing examples
* copy/modify desired sections into main stylesheet, integrating with existing declarations, and delete this file
* Categories Dressing v2.0   Glenn Herbert (gjh42)  2007-07-13
*/
/*
hr.catBoxDivider { 
    color: #aabbcc;
    }
*/
.catBoxHeading { 
    font-family: 'times new roman', serif;
    font-weight: bold;
    font-size: 1.4em;
    color: #333333 
    background-color: #ff66ff;
    background-image: url(../images/catbg25.gif);  
    height: 23px;  
    display: block;
    padding: 0.3em 0.4em;
    margin-top: 2px;
    margin-bottom: 2px;
    }  
/*
.catBoxSubtext {
    font-family:  'times new roman', serif;
    font-weight: normal;
    font-size: 1.2em;
    color: #333333; 
    background-color: #ffddff;
    display: block;
    padding: 0.1em 0.2em 0.1em 1.0em;
    }  

/*display all cat box links as block*/
#chcategories a {
    background-repeat: no-repeat;
    display: block;
    }
	
/*example for individual category as bg image*/

/* example for  top category styling */
a.category-top-text {
    /*background-color: #ccddff;*/
        font-family: arial, verdana, helvetica, sans-serif;
	font-size: 13px;
	color: #333333; 
	padding-top: 0.2em;
	padding-right: 0pt;
	padding-bottom: 0pt;
	padding-left: 0em;
	margin-top: 0pt;
	margin-right: 0pt;
    margin-bottom: 0pt;
    margin-left: 0pt;
    display: block;
    height: 1.8em;
    border-bottom-width: 1px;
    border-bottom-style: solid;
    border-bottom-color: #9a9a9a;
    background-color: #eeeeee;
    background-image: url(../images/boxlistbg.gif);
    background-repeat: no-repeat;
    background-attachment: scroll;
    background-x-position: 0.4em;
    background-y-position: 0.5em;


/*margin: 0.2em 0;*/
    /*padding: 0.2em 0.3em;*/
    } 

a.category-subs-text, a.category-products-text  {
    /*background-color: #ff69ff;*/
    color: #6699aa;  
    /*margin: 0.2em 0;*/
    /*padding: 0.2em 0.3em;*/
    } 

/* uncomment for  top category hover effects (add ,  a.category-subs-text, a.category-products-text if desired) (use  background-image if desired)*/
a.category-top-text:hover {
    font-family: arial, verdana, helvetica, sans-serif;
	font-size: 13px;
	background-color: #ff4872;
    color: #ffffff; 
	display: block;
	font-weight: bold;
    background-repeat: no-repeat;
    background-attachment: scroll;
    background-x-position: 0em;
    background-y-position: 0em;
	font-weight: bold;
	} 
	
a.category-subs-text:hover, a.category-products-text:hover  {
    background-color: #ff69ff;
    color: #ffffff;  
    margin: 0.2em 0;
    padding: 0.2em 0.3em;
    } 

/* bullet for top categories & links:*/
a.category-top-text .category-not-selected, a.category-top-text .category-subs-selected, #chcategories a.category-links {
    display: list-item;
    list-style: disc inside url(../images/bullet1.gif);
    }
	
/*change  bullet when a category is open to subs:*/
a.category-top-text .category-subs-parent {
    display: list-item;
    list-style: square inside url(../images/bullet2.gif);
    }

/*bullet for subcategories:*/

a.category-subs-text, a.category-products-text {
    display: list-item;
    list-style: circle inside url(../images/bullet3.gif);
    }

/*different bullet for links*/

#chcategories a.category-links {
    display: list-item;
    list-style: disc inside url(../images/bullet4.gif);
    }
*/

And heres my site again in case. http://www.citysatchel.com/zen-cart

Im gonna go through and try to remove any residuals of the expanded category mod to see if that works. ANy other suggestions?

Thanks again for your help!