What folder do you add coding to enable divider lines, i used the code from an older version of this mod and placed it in the stylesheet but it didnt work.
Printable View
What folder do you add coding to enable divider lines, i used the code from an older version of this mod and placed it in the stylesheet but it didnt work.
The readme describes the process for adding dividers. For example:
define ('CAT_BOX_HEADING_52','0|1||');//divider only - style 1
define ('CAT_BOX_HEADING_53','0|2||');//divider only - style 2
I can see that but, but i dont know what file that is in to edit,
it was in languages/english/extra_definitions/custom/categories_dressing_defines.php
I thought you knew that defines were here.
Ive been looking at this now since you replied, and i really cant work it out, in my other copy the is a line where you put the page id seperated by a comma e.g 1,2,3,4,5 etc etc but i cant see that line in this version. im sure its a very easy fix, but i cant work it out.
That method is completely replaced by the "define" file method. Forget about the comma-separated numbers, and make new copies of the define for each category where you want a divider.
I tried adding
define ('CAT_BOX_HEADING_2','1|1||');//divider only - style 1
define ('CAT_BOX_HEADING_3','1|1||');//divider only - style 1
define ('CAT_BOX_HEADING_4','0|1||');//divider only - style 1
define ('CAT_BOX_HEADING_5','0|1||');//divider only - style 1
define ('CAT_BOX_HEADING_6','0|1||');//divider only - style 1
define ('CAT_BOX_HEADING_7','0|1||');//divider only - style 1
define ('CAT_BOX_HEADING_8','0|1||');//divider only - style 1
But that was obviously wrong as it didnt work, what should i be writing to get divider lines between category ID 2 - 9
And you added that to /includes/languages/english/extra_definitions/custom/categories_dressing_defines.php?
If so, it should work. Did you make any changes in tpl_categories.php, or any other mod files beside the stylesheet?
Note that the dividers go above the selected category, so you would get dividers between categories 1 - 8 with the defines you show.
I refreshed a few times and it has worked :smile:
Do you know what code i should add to make the hover color fill the complete space between the dividers.
Thanks
You would want to edit the hr.catBoxDivider1 {} rule in the stylesheet to make its height or line-height only 1 pixel... experiment.
Is this the correct code
hr.catBoxDivider1 {
color: #aabbcc;
line-height: 1px;
}
Hello Glenn:
Maybe I should PM you on this as it is not strictly a questions.
In my discussion with Website Rob and our past conversations, I know you are working on modifying the code so that the list meets standards. Not meaning to rush you, but can you give me an ETA as to when you anticipate having this complete? Do you require assistance? I have a php programmer that could help you out on my $$. Let me know.
thanks.
Hi
This mod offers what I am looking for in order to customize my category box but I am hoping for a little help. I installed it on my site www.poconogiftbaskets.com/catalog I have gone over the readme file several time but am having trouble editing the code within the categories_dressing_defines.php to make the changes I want. I am using zencart 1.38a Basically, I would like to remove the black bullets in front of each category listing. I also wanted my list of categories to be organized in 3 seperate groups, each with its own non-linking header and seperated by a divider. To look something like this.
Special Occasions
Administrative Professionals
Holiday & Seasonal
Wedding & Anniversary
Baby
Birthday
Get Well
Thank You
Housewarming
Sympathy
Congratulations
Thinking of You
####################____
Theme Designs
Care Packages
Gifts for Him
Gourmet Delight
Snacks & Sweets
Romance
Fine Chocolate
Coffee & Tea
Gift Towers
Sports & Leisure
Spa
##############################
Corporate Collection
Client Appreciation
Employee Recognition
Real Estate Gifts
Gifts at Marketing Tools
Any help with this would be greatly appreciated.
Thanks
Lisa
The bullets are handled by CSS - look in stylesheet_categories_dressing.css for the comments about removing bullets (you will want to use list-style: none;).
For the groups, you want to specify in categories_dressing_defines.php that the category id of the first category in each group (Administrative Professionals, Care Packages, Client Appreciation) begins a new group, has a text heading with content as shown, and the second and third have dividers above them.Replace 23, 24 and 25 with the correct category ids.PHP Code:define ('CAT_BOX_HEADING_23','1|0|||Special Occasions|1');//new list - text heading - style 1
define ('CAT_BOX_HEADING_24','1|1|||Theme Designs|1');//new list - divider and text heading - style 1
define ('CAT_BOX_HEADING_25','1|1|||Corporate Collection|1');//new list - divider and text heading - style 1
Glenn,
Thanks so much for your help with the php code for the categories_dressing_define file. Now, I can just experiment with the styling in the css file which I am more familiar with doing.
Thanks again,
Lisa
Hi Glen,
I have installed the mod and want to modify mine so it looks like this:
GIRLS
Dresses
Tops
Bottoms
Outerwear
GUYS
Tops
Bottoms
Outerwear
ACCESSORIES
jewellery
Sunnies
Bags
Shoes
Home & Lifestyle
I dont want to have any bullets or decoration just rollovers. Thank you!!!
Your process would be the same as in post 714 above, with the names changed to fit your situation.
If you don't want any dividers, make sure all of the defines start like this:
'1|0|||
Great it worked perfectly but how do i add a 'GUYS' image as a title and a "ACCESSORIES" image as a title like the GIRLS one i have???
Sorry i found it:
define ('CAT_BOX_HEADING_2','1|1|cathead2.gif|||1');//new list - divider and text heading - style 1
Thanks for the help!!!:clap:
You got the image, though there are a couple of other things to fix in your posted line.
You can add an alt tag to the title image in the next field after the filename:
,'1|1|cathead2.gif|Guys||1');
and you should not have fields after the tag field if you don't want text headings:
,'1|1|cathead2.gif|Guys');
If you want no alt tag, you can leave the tag field empty:
,'1|1|cathead2.gif|');
I just tried to use CategoriesDressing 2.6 for those nested ul / li constructs i would prefer. But i do not get a nested list with my top and sub categories. The top-category ends with /li and the sub-categories under it are a separated ul. It should be:
How can I get this nested list?HTML Code:<ul>
<li> Top Category1</li>
<li> Top Category2
<ul>
<li>Sub Category</li>
</ul>
</li>
</ul>
What I currently get is this:
HTML Code:<ul>
<li> Top Category1</li>
<li> Top Category2 </li>
<ul>
<li>Sub Category</li>
</ul>
</ul>
I am currently testing the revised code to make the lists nest correctly. The updated version should be ready for public testing in a few days.
Glenn - Thank you so much! That is a great message. I will wait for that.
Is there a version I could contribute to? One where you started from?
Miriam
Hi Glenn
I'm on v1.3.8, site is www.tessellatedesign.com
I installed the categories dressing mod (all files in custom folders) and it's all fine except I cannot get rid of the bullet points before the category links.
I've put list-style: none; everywhere I should have (I've checked and double checked this).
I've commented out the code for using other bullets.
The only change that happens is when I comment out this section:
/*disable bullet for cats w/ image or bg image*/
#categories li a.cat-parent, #categories li a.cat-selected, #categories li a.cat-not-selected {
list-style: none;
display: block;/*fix IE6 margin-left bug*/
}
when I do that the bullets move from the far left of the sidebox to the left of the image links...which is where I've left it.
Today I started afresh with the clean stylesheet_categories_dressing.php, put list-style: none; in all of the places indicated and the buggers won't go. ...I have a feeling it's something very simple to rectify this but I'm now so zenned out I'm almost cross eyed!
and thank you for a great mod, other than my never disappearing bullets it's great...!
OK I have installed categories dressing with no problems EXCEPT now in my categories list I have "Major Heading" and "Minor Heading" within the list and I can't for the life of me figure out how to remove this text. I've done many searches and still can't find an answer. Any help would be greatly appreciated.
my site is Chrissie's Custom Creations
On the left hand side you see my list of categories where I am having the problem.
TIA for any help :hug:
:oops: Duh, I figured it out! I'm sorry
No, you didn't ;-) When I put it in your stylesheet at the part for the definition of the sidebox:Quote:
Originally Posted by fizmo
the list-bullets are gone.HTML Code:stylesheet.css (Linie 604)
.sideBoxContent {
line-height:1.8em;
list-style-image:none;
list-style-position:outside;
list-style-type:none;
text-align:center;}
And here you are: list-style: none for the div which is holding the categories. If you leave this they should be gone too, but your categories are named li class="cat-top". You can apply that class additionally to the definition above like #categories li.cat-top and should get the same result.Quote:
Originally Posted by fizmo
What I am wondering is: where is gone your <ul> ? You have only <li> around the cat-image, without <ul>, which should be there if you didn't change the tpl_categories.php.
By the way: do you use Firefox with the firebug extension? That is helpful and useful to find those little tweaks quickly.
all sorted, thanks for the help Glenn (and for the tip on Firebug)...and I'll check on the missing <ul>
cheers!
Thanks for your assistance, Miriam. I've been away for a couple of days and had no time to look in here.
The v2.7.1 revision for correctly nested lists, and some additional active/level controls, is ready for public beta testing. Please try it and let me know if you find any problems. If I don't hear of anything in a couple of days, I'll submit the update to Free Addons.
I just installed the Mod (2.6) and I have problems with long category names which do not fit in one line. The problem is that the second line starts just underneath the bullet and not under the first line text.... any hints on what to change that text is lined up correctly :wacko:
Changing the list-style to outside and giving the anchors some left margin will do it, but that will also cut off the left edge of the background color if you have one. If the background is not differentiated you should be fine. Gotta run.
Thx for quick reply. Got that "outside" working changing these two parts:
#categories ul a {/*top categories*/
display: list-item;
list-style: disc outside url(../images/bullet1.gif);/*change to list-style: none; to remove bullet*/
background: no-repeat;
border: none;
margin: 0;
padding: 0;
}
#categories ul ul a {/*subcategories*/
display: list-item;
list-style: circle outside url(../images/bullet1.gif);/*change to list-style: none; to remove bullet*/
background: none;
border: none;
margin: 0;
padding: 0;
}
:clap:
However cannot find the place where to specify the margin you mentioned. Background is no problem. :no:
Quote:
Originally Posted by wow11111
Got it... was just here:
#categories ul a {/*top categories*/
display: list-item;
list-style: disc outside url(../images/bullet1.gif);/*change to list-style: none; to remove bullet*/
background: no-repeat;
border: none;
margin: 0 0 0 1.7em;
padding: 0;
}
#categories ul ul {/*subcategories*/
list-style: none;
background: none;
border: none;
margin: 0 0 0.4em 2.2em;
padding: 0;
}
The last level shown in the menu are products. Is there a way to get them a bit more left ? All I could adjust only affects categories and subcategories and always moves the products too.
There are no products in the categories menu unless you have some mod installed. What do you have that does that? Clyde Jones' Expanded Categories? That one shows products too, but I wasn't aware that it could be used with Cat Dressing.
To affect sub-subcategories, repeat the ul ul rule for #categories ul...
#categories ul ul ul {/*sub-subcategory list*/
and
#categories ul ul ul a{/*sub-subcategories*/
Perfect, THX. Got it now. :clap:
in the stylesheet when it says:Quote:
Originally Posted by wow11111
alter to read:HTML Code:list-style: disc inside url(../images/bullet1.gif);
HTML Code:list-style: disc url(../images/bullet1.gif);
Thanks again for that! I just tried out your files and they work in my installation just as they should - every list is standard conform to w3c - now we ready as Standardistas! Thanks a lot! Three little greens in my browser window at the right now! I'm happy.Quote:
Originally Posted by gjh42
hey Glenn,
got hopefully a quick one for ya...
www.customk9design.com/catalogzen
in FF, Opera, Safari and Google:
have SMALL space between "harnesses" and "saddlebags" that isnt anywhere else...
in IE:
have a larger space between each category...
any solutions?
here is my pertinent css, let me know if you need additional info:
Code:/**
* CSS Stylesheet for Categories Dressing examples
* @copyright Copyright 2009 Glenn Herbert
* @copyright Copyright 2003-2006 Zen Cart Development Team
* @copyright Portions Copyright 2003 osCommerce
* @license http://www.gnu.org/licenses/ GNU Public License V3.0
* Categories Dressing v2.6 Glenn Herbert (gjh42) - 20090128
*/
/*
hr.catBoxDivider1 {
color: #aabbcc;
}
*/
/*IE6 hacks*/
* html #categories li, * html #categories li a {
height: 1em;/*fix IE6 whitespace bug*/
background-image: url(../images/pixel_trans.gif);/*partially fix IE6 a block display bug*/
}
/*.catBoxHeading1 {
font-family: georgia, serif;
font-weight: bold;
font-size: 1.4em;
color: #335511;
background-color: #ff66ff;
/*background-image: url(../images/catheadbg1.gif); */ /*uncomment to use background image with or without coded text*/
/*height: 23px; */ /*uncomment to use background image without coded text*/
/* padding: 0.3em 0.4em;
margin: 0;
} */
/*.catBoxHeading2 {
font-family: 'times new roman', serif;
font-weight: bold;
font-size: 1.4em;
color: #335544;
background-color: #ffaaff;
/*background-image: url(../images/catheadbg2.gif); */ /*uncomment to use background image with or without coded text*/
/*height: 23px; */ /*uncomment to use background image without coded text*/
/* padding: 0.3em 0.4em;
margin: 0 0 2px 0;
}
/*.catBoxHeading3 {
font-family: 'comic sans ms', sans-serif;
font-weight: bold;
font-size: 1.2em;
color: #336699;
background-color: #ffbbdd;
/*background-image: url(../images/catheadbg3.gif); */ /*uncomment to use background image with or without coded text*/
/*height: 23px; */ /*uncomment to use background image without coded text*/
/* padding: 0.3em 0.4em;
margin: 0 0 2px 0;
}
/*.catBoxHeadingImg {
padding: 0;
margin: 0;
}
/*.catBoxSubtext1 {
font-family: 'times new roman', serif;
font-weight: normal;
font-size: 1.2em;
color: #669911;
background-color: #ffddff;
padding: 0.1em 0.2em 0.1em 1.0em;
}
*/
#categories ul {/*top categories*/
list-style: none;
background: none;
border: 0px solid #ffaa99;
margin: 0 0 0 0;
padding: 0;
}
#categories ul a {/*top categories*/
display: list-item;
list-style: none;/*change to list-style: none; to remove bullet*/
background: no-repeat;
border: none;
margin: 0;
padding: 0;
}
#categories ul ul {/*subcategories*/
list-style: none;
background: #ffeecc;
border: none;
margin: 0 0 0 0;
padding: 0 0 0 0;
}
#categories ul ul a {/*subcategories*/
display: list-item;
list-style: circle inside url(../images/bullet1.gif);/*change to list-style: none; to remove bullet*/
background: #ffddbb;
border: none;
margin: 0;
padding: 0;
}
/*change bullet when a category w/o bg image is open to subs:*/
#categories li a.cat-parent-text {
list-style: square inside url(../images/bullet2.gif);/*change to list-style: none; to remove bullet*/
}
/*change bullet when a category w/o bg image is open to products:*/
#categories li a.cat-selected-text {
list-style: square inside url(../images/bullet3.gif);/*change to list-style: none; to remove bullet*/
}
/*disable bullet for cats w/ image or bg image*/
#categories li a.cat-parent, #categories li a.cat-selected, #categories li a.cat-not-selected {
list-style: none;
display: block;/*fix IE6 margin-left bug*/
}
/*different bullet for links if desired*/
/*
#categories li a.category-links {
list-style: disc inside url(../images/bullet4.gif);
}
*/
/* top category hover effects*/
/* #categories li.cat-top a:hover {
background: #000000 url(../images/catbghover.gif);
} */
/* subcategory hover effects*/
/* #categories li li.cat-subs a:hover, #categories li li.cat-products a:hover {
color: #aa9966;
background: #000000 url(../images/catbghover.gif);
} */
/*individual page rules go after the general rules*/
#categories li a.catBg1 {
background: url(../buttons/english/catbg1.gif) 0 0 no-repeat;
height: 27px;
}
#categories li a.catBg1:hover {
background-position: -167px 0;
}
#categories li a.catBg2 {
background: url(../buttons/english/catbg2.gif) 0 0 no-repeat;
height: 27px;
}
#categories li a.catBg2:hover {
background-position: -167px 0;
}
#categories li a.catBg3 {
background: url(../buttons/english/catbg3.gif) 0 0 no-repeat;
height: 27px;
}
#categories li a.catBg3:hover {
background-position: -167px 0;
}
#categories li a.catBg4 {
background: url(../buttons/english/catbg4.gif) 0 0 no-repeat;
height: 27px;
}
#categories li a.catBg4:hover {
background-position: -167px 0;
}
#categories li a.catBg5 {
background: url(../buttons/english/catbg5.gif) 0 0 no-repeat;
height: 28px;
}
#categories li a.catBg5:hover {
background-position: -167px 0;
}
#categories li a.catBg6 {
background: url(../buttons/english/catbg6.gif) 0 0 no-repeat;
height: 27px;
}
#categories li a.catBg6:hover {
background-position: -167px 0;
}
#categories li a.catBg7 {
background: url(../buttons/english/catbg7.gif) 0 0 no-repeat;
height: 27px;
}
#categories li a.catBg7:hover {
background-position: -167px 0;
}
#categories li a.catBg8 {
background: url(../buttons/english/catbg8.gif) 0 0 no-repeat;
height: 27px;
}
#categories li a.catBg8:hover {
background-position: -167px 0;
}
#categories li a.catBg9 {
background: url(../buttons/english/catbg9.gif) 0 0 no-repeat;
height: 27px;
}
#categories li a.catBg9:hover {
background-position: -167px 0;
}
.catCount {color: #000000;}
Hello customk1!
I'm not Glenn, but ...
I can see, that there IS indeed a small transparent image between these categories:Quote:
Originally Posted by customk1
<img height="100%" width="100%" title="Harnesses" alt="" src="includes/templates/template_default/images/pixel_trans.gif"/>
Perhaps you can check that?
Also perhaps: I cannot try this but I know that margin and padding must be set to 0 for <li>, to achieve a consistent appearance throughout all browsers. Otherwise every browser makes his own margins/paddings to block elements.Quote:
Originally Posted by customk1
i added:
margin: 0 0 0 0;
padding: 0 0 0 0;
to the 1st four li items:
#categories li a.catBg1 {
background: url(../buttons/english/catbg1.gif) 0 0 no-repeat;
height: 27px;
margin: 0 0 0 0;
padding: 0 0 0 0;
}
#categories li a.catBg1:hover {
background-position: -167px 0;
margin: 0 0 0 0;
padding: 0 0 0 0;
}
etc....
no change to the padding in IE. still trying to find that pixel.gif file... will let u know if i have no luck.
ok, so i found where that file is referenced several times... however they are all regarding php if/else statements...
so the issue is in the code or the css somewhere that is telling it to use that image... dont want to change the code to not call it, need to fix the actual problem with the "harnesses" category... and why it feels the need to use the "else" instead of the "if"...
?? any thoughts?
The pixel_trans.gif is to give the <a> something to contain - IE doesn't like an empty <a> element and won't give it a size.
I see the space in Firefox, but don't have time at the moment to investigate further. Will check in later.
Dear all,
I would like to ask for your advice(s) on Categories Dressing, but I posted to wrong forum, please have a look:
http://www.zen-cart.com/forum/showth...177#post720177
Thank you in advance.
Tim
Before trying to debug the particular code you posted, I have a question.
Do you want all top categories styled in the way you describe, and all subcategories in another way? If so, you don't need to modify any PHP files, just use the stylesheet.
It is possible to style top categories and subcats differently in stock Zen Cart without installing any mods, though Categories Dressing will also allow more extensive changes. Your stylesheet rule seems to show that you want the block display furnished by Cat Dressing, so you should probably continue with it.
Before I go on, please post a link to see your site, and let me know about the styling question.
Thank you, Glenn, for your reply.
Here is the link of my store: http://www.pacificphm.com/store
I want to have all categories names in a large font-size and specific background, subcategories in smaller fonts.
More, I want to have all subcategories (of all categories) displayed in left column (even if visitors don't click on category name).
I prefer to use Categories Dressing what you provided, but surprised why my mod doesn't work. If I get it worked, I think I can modify the site by my way, I am ok with CSS.
Thank you again, Glenn.
Tim
To have all subcategories showing all the time, you need an expanded categories mod. The newest version of Categories Dressing includes an optional expanded categories mod (Uncollapsed Categories Tree). It is not available in Free Addons yet, but I posted it in post 729 above. I have made a few changes from it in my development set, but what is there will work for what you want.
It will be easier for you to use the stylesheet to style
#chcategories ul a {}
for top categories and
#chcategories ul ul a {}
for subcategories than to try to style each top cat individually as you started to do.
Note - your site is password-protected and I can't see it.
oh sorry, I just took password away.
Here is a set of Categories Dressing v2.7.2, with <ul> validation improved and a few other minor tweaks. Thanks to Website Rob for advice. Unless someone finds an error in this, I will submit it to Free Addons in a day or so.
The zip in post #729 has been deleted.
glenn, did you get a chance to look into that weird space i have in FF, and the consistent space i have in IE?
Harnesses is category 5... do you see a pattern? :)Code:#categories li a.catBg4 {
background: url(../buttons/english/catbg4.gif) 0 0 no-repeat;
height: 27px;
}
#categories li a.catBg4:hover {
background-position: -167px 0;
}
#categories li a.catBg5 {
background: url(../buttons/english/catbg5.gif) 0 0 no-repeat;
height: 28px;
}
#categories li a.catBg5:hover {
background-position: -167px 0;
}
#categories li a.catBg6 {
background: url(../buttons/english/catbg6.gif) 0 0 no-repeat;
height: 27px;
}
#categories li a.catBg6:hover {
background-position: -167px 0;
}
#categories li a.catBg7 {
background: url(../buttons/english/catbg7.gif) 0 0 no-repeat;
height: 27px;
}
Dear all,
I have an "empty line" between category name and first subcategory name, I remember I saw a post about this problem somewhere but unfortunately I can't find it again by searching.
When I use Firefox Firebug, I see "<br/>" right there, but don't know what file I need to edit and remove it.
Please, advise me how to fix it, thank you.
Tim
bah! i tooootally checked that. i think someone went in and changed it to make me look bad.. LMAO!!
ok, so that fixed the firefox problem... still have spacing in IE, im not too worried about it, because it looks consistent... but am curious if there is an easy fix? if not... no worries!
thanks as always glenn!
Tim,
You have ch_categories installed, but not Categories Dressing, so the block display of the top categories is causing the space.
You can fix this for modern browsers by adding to your stylesheet:
#chcategories a.category-top+br {display: none;}
This will not work in IE6 because it does not understand the "+", but if you are ok with users of this old browser having an extra space in the list, you can call it good. Otherwise, you will have to install the Cat Dressing files and make the stylesheet changes in stylesheet_chcategories_dressing.css.
Dear Glenn,
How to check if the mod works after uploading all the Categories Dressing files ? I follow all the guidelines for installing the mod, but I don't see any change, means, no effect from the mod (maybe these files are ignored). Please, advise me, thank you.
Tim
Are you sure the files are in the right template folders? Please check and post the exact filepath to tpl_categories.php, and verify that it is the Cat Dressing version of the file.
Hi Glen,
I wonder if you could tell me the easiest way to go from this (existing):
http://www.limelites.co.uk/screen5.jpg
To this:
http://www.limelites.co.uk/screen5b.jpg
I'd like the new products and the all products llinks moved to the top with a seperator but don't know the easiest way to do it without loads and loads of trial and error :-(
You would want to move the whole "links" code section near the top of tpl_categories.php. This would not be difficult, but would require a lot of making sure the right parts go in the right order - you would need to know how everything works to tweak it correctly.
Another possibility would be giving #chcategoriesContent position: relative; and padding-top: 5em; more or less so it will be a positioning context with an open space at the top, and giving #catLinks position: absolute; top: 0; so it sits at the top of the box.
Add a divider above the Womens category.
I have to leave for the weekend now - will look in when I return.
Hi Glen,
I figured it out. Just moved a couple of blocks of code around in tpl_categories.php as you suggested. Here is the content of my modified file for anyone who's interested in having 'new products' and 'all products' links above all of their categories at the very top:
PHP Code:<?php
/**
* Side Box Template
*
* @package templateSystem
* @copyright Copyright 2009 Glenn Herbert
* @copyright Copyright 2003-2006 Zen Cart Development Team
* @copyright Portions Copyright 2003 osCommerce
* @license http://www.zen-cart.com/license/2_0.txt GNU Public License V2.0
* @version $Id: tpl_categories.php 4162 2006-08-17 03:55:02Z ajeh $
* Modified for Categories Dressing v2.6 by Glenn Herbert (gjh42) - 20090128
* Referenced files:
* includes/functions/extra_functions/categories_dressing_functions.php
* includes/languages/english/extra_definitions/your_template/categories_dressing_defines.php - make user settings here
*/
$content = "";
$prev_cat_depth = -1;
$content .= '<div id="' . str_replace('_', '-', $box_id . 'Content') . '" class="sideBoxContent">' . "\n";
// display a separator between categories and links
$content .= '<ul class="catLinks">';
if (SHOW_CATEGORIES_BOX_SPECIALS == 'true') {
$cat_box_link_head = cat_box_heading('SPECIALS');
$content .= $cat_box_link_head[1];
$show_this = $db->Execute("select s.products_id from " . TABLE_SPECIALS . " s where s.status= 1 limit 1");
if ($show_this->RecordCount() > 0) {
$content .= '<li><a class="category-links" href="' . zen_href_link(FILENAME_SPECIALS) . '">' . CATEGORIES_BOX_HEADING_SPECIALS . '</a>' . '</li>' . "\n";
}
}
if (SHOW_CATEGORIES_BOX_PRODUCTS_NEW == 'true') {
// display limits
// $display_limit = zen_get_products_new_timelimit();
$display_limit = zen_get_new_date_range();
$show_this = $db->Execute("select p.products_id
from " . TABLE_PRODUCTS . " p
where p.products_status = 1 " . $display_limit . " limit 1");
if ($show_this->RecordCount() > 0) {
$cat_box_link_head = cat_box_heading('NEW');
$content .= $cat_box_link_head[1];
$content .= '<li><a class="category-links" href="' . zen_href_link(FILENAME_PRODUCTS_NEW) . '">' . CATEGORIES_BOX_HEADING_WHATS_NEW . '</a>' . '</li>' . "\n";
}
}
if (SHOW_CATEGORIES_BOX_FEATURED_PRODUCTS == 'true') {
$show_this = $db->Execute("select products_id from " . TABLE_FEATURED . " where status= 1 limit 1");
if ($show_this->RecordCount() > 0) {
$cat_box_link_head = cat_box_heading('FEATURED');
$content .= $cat_box_link_head[1];
$content .= '<li><a class="category-links" href="' . zen_href_link(FILENAME_FEATURED_PRODUCTS) . '">' . CATEGORIES_BOX_HEADING_FEATURED_PRODUCTS . '</a>' . '</li>' . "\n";
}
}
if (SHOW_CATEGORIES_BOX_PRODUCTS_ALL == 'true') {
$cat_box_link_head = cat_box_heading('ALL');
$content .= $cat_box_link_head[1];
$content .= '<li><a class="category-links" href="' . zen_href_link(FILENAME_PRODUCTS_ALL) . '">' . CATEGORIES_BOX_HEADING_PRODUCTS_ALL . '</a>' . '</li>' . "\n";
}
if (SHOW_CATEGORIES_SEPARATOR_LINK == '1') {
$content .= '<hr id="catBoxDivider" />' . "\n";
}
for ($i=0;$i<sizeof($box_categories_array);$i++) {
switch(true) {
// to make a specific category stand out define a new class in the stylesheet example: #categories li.cat-holiday a {}
// uncomment the select below and set the cPath=3 to the cPath= your_categories_id
// many variations of this can be done
case ($box_categories_array[$i]['path'] == 'cPath=1'):
$new_style = 'bolder';
break;
case ($box_categories_array[$i]['top'] == 'true'):
$new_style = 'top';
break;
case ($box_categories_array[$i]['has_sub_cat']):
$new_style = 'subs';
break;
default:
$new_style = 'products';
}
$current_path = str_replace("cPath=","",$box_categories_array[$i]['path']);
$skip_cat = 0;
$skip_cat = cat_active_level_manage($current_path);
if (substr_count($box_categories_array[$i]['path'],'_') > 1 or zen_get_product_types_to_category($box_categories_array[$i]['path']) == 3 or ($box_categories_array[$i]['top'] != 'true' and SHOW_CATEGORIES_SUBCATEGORIES_ALWAYS != 1)) {
} else {
$cat_box_heading = cat_box_heading($current_path);
$cat_ul = cat_ul_manage($current_path, $prev_cat_depth, $cat_box_heading[0]);
$content .= $cat_ul;
$content .= $cat_box_heading[1];
$cat_name_display = cat_name_display($box_categories_array[$i]['name'], $current_path);
$active_class = ($box_categories_array[$i]['current'])? ($box_categories_array[$i]['has_sub_cat']? 'parent': 'selected'): 'not-selected';
$content .= '<li class="cat-' . $new_style . '"><a class="cat-' . $active_class . $cat_name_display[0] . '" href="' . zen_href_link(FILENAME_DEFAULT, $box_categories_array[$i]['path']) . '">';
$content .= $cat_name_display[1];
if ($box_categories_array[$i]['has_sub_cat'] and $cat_name_display[0] == '-text') {
$content .= CATEGORIES_SEPARATOR;
}
if (SHOW_COUNTS == 'true' and $cat_name_display[0] == '-text') {
if ((CATEGORIES_COUNT_ZERO == '1' and $box_categories_array[$i]['count'] == 0) or $box_categories_array[$i]['count'] >= 1) {
$content .= '<span class="catCount">' . CATEGORIES_COUNT_PREFIX . $box_categories_array[$i]['count'] . CATEGORIES_COUNT_SUFFIX . '</span>';
}
}
$content .= '</a></li>' . "\n";
$content .= cat_box_subtext($current_path);
}
}
$content .= str_repeat('</ul>',$prev_cat_depth+1);
if (SHOW_CATEGORIES_BOX_SPECIALS == 'true' or SHOW_CATEGORIES_BOX_PRODUCTS_NEW == 'true' or SHOW_CATEGORIES_BOX_FEATURED_PRODUCTS == 'true' or SHOW_CATEGORIES_BOX_PRODUCTS_ALL == 'true') {
$content .= '</ul>';
}
$content .= '</div>';
?>
Hmmm not sure if you'd have moved that code around differently Glen, but it's had one minor effect on the way the highlighted/selected categories behave.
When I click for example on dresses sub category, the red line (bullet3.gif) goes next to the main category womenswear as well as dresses.
Before I moved those code blocks, bullet3 only appeared on the actual dresses category and the main womenswear parent category only changed to bold type (no bullet3)...
Maybe when you get back from a nice weekend away, you could take a look and see if you can find what I've done wrong?
Dear all,
After applying Categories Dressing I see all the <li> in front of all categories and subcategories names, please, advise me, how to remove them !
Thank you.
Tim
I tried to use
list-style:none;
everywhere in stylesheet_categories_dressing.css, but the problem remains ...
Post a URL link to your site. It's impossible to diagnose without being able to look.
Problem solved by uploading stylesheet_chcategories_dressing.css, thank limelites anyway !
Heyyy, glad you got that sorted, good luck with the next task :-)
I have another problem ... :)
I can add all non-linked "top categories headings" (with categories_dressing_defines.php), but original (linked) headings stay displayed. I can hide all these (linked) top categories, but if I do so, all my non-linked headings disappear too :D
I want non-linked headings, and linked headings not shown.
What do I have to do ? :)
Tim
You can make the non-linked headings belong to the first subcategory in each group, instead of belonging to the top categories. That will let you hide the top cats while still showing the headings.
Thank Glenn, for good idea.
I just made the change as you advised. Unfortunately, I can't eliminate the space (empty row) right over the first top-category (the one with cPath=1) (only with IE). It looks fine with Firefox.
Please, have a look at it: http://www.pacificphm.com/store
Tim
Can anyone please advise me how to change topcat names to linked images in CatTabs. I use cattabs for topcat and sidebar for all subcat. I can't seem to find option to replace image with text
tnx
Categories Dressing applies only to the sidebox, not to the cat-tabs menu. It would be possible to adapt some of the code for your purpose, but that is a subject for another thread.
Tim -
I don't see the problem you describe in IE6; what version are you using?
I do see odd green bands at the bottoms of cat groups, where there is whitespace in Firefox. This might be related to a bug I have found in the code which only shows up with your particular subcat layout: the outermost <li> is not closed. You can fix this by adding </li> to a line in /includes/functions/extra_functions/categories_dressing_functions.php:AddPHP Code:function cat_ul_manage($current_path, &$prev_cat_depth, $new_group) {
// ... find line 69:
} elseif ($cat_depth < $prev_cat_depth) {//higher
$ul_content .= str_repeat('</li>' . "\n" . '</ul>',($prev_cat_depth - $cat_depth)) . ($new_group?'</li>' . "\n" . '</ul>' . ($cat_depth > 0? '</li>' . "\n" . ' <li>':"\n") . "\n" . '<ul' . $group_id . '>':'') . "\n";
</li>
to change the
$group_id . '>':'') . "\n";
at the end of this line to
$group_id . '>':'</li>') . "\n";
Hi All,
Let me begin with - We have many categories.
So far I have this working pretty well but am having some trouble with sub-cats and sub-sub-cats. Not sure what they're really called.
Looks like we're calling them a.category-subs-text & a.category-products-text.
I have split my top cats into groups. So let's call the first group "group1". In group1 I have 3 subs, each sub has 2 subs. I would like the background-color to be yellow for all of these.
I can get the background color to change for each category individually but the subs and sub-subs are either all one color or nothing. Meaning that I cant seem to get the subs and sub-subs in group1 to be yellow and leave the other groups subs and sub-subs alone.
I hope I have not confused the help here. Please let me know a solution to this.
Thank you,
John
Got it. What's next? :cool:
lol
Thanks guys,PHP Code:case ($box_categories_array[$i]['path']== 'cPath=76_263'):
$new_style = 'category-76263';
break;
John
Hi Glenn,
I did as you said, but it doesn't help ... never mind, I am trying to improve it ...
Tim
Problem solved by setting leftBoxHeading background color to white :) thank anyway
Tim
John -
To control background color in all subcats and sub-subcats in one group, you can add a pair of rules after the generic rules like this:This will apply only inside catGroup1 (adjust the id to match your actual situation).Code:#categories ul#catGroup1 ul a {/*subcategories of group 1*/
background: #aaddbb;
}
#categories ul#catGroup1 ul ul a {/*sub-subcategories of group 1*/
background: #bbddbb;
}
hello, this mod works great! i am having a little trouble though. im trying to do the bonus part to have a customized style for each category, and it isnt working. my site is just a test site, and the images will all be changing, im just trying to play with functionality
http://extendmydesign.com/bloomsofts/
here is my code in tpl_categories:
case ($box_categories_array[$i]['path'] == 'cPath=1'):
$new_style = 'language';
break;
i changed the path to the correct one.
here is my css code
#categories li.cat-language a {
color: #999999;
background-image: url(../images/catbghover.gif);
background-repeat: no-repeat;
padding-left:20px;
height: 20px;
}
#categories li.cat-language:hover a {
color: #999999;
background-image: url(../images/catbgl.gif);
background-repeat: no-repeat;
padding-left:20px;
height: 20px;
}
i know my hover and regular images are backwards lol, i messed it up. but it is still calling the images from the main style. i have one more question after this, but i figured i would try to figure this one out first.
the other question is how to get the clickshowhide mod's effect working with this mod, i REALLY need it.
Are you aware that you used a letter "l" instead of a numeral "1" in the filename?
catbgl.gif
yes, its l for the cat languages
Hi Glenn,
Please, have a look at this site with IE7
http://www.pacificphm.com/store
There is an empty row (space) above the first categoryBoxHeading (cPath=1), do you know how to remove it ?
This problem occurs only with IE7, it looks fine with FFox
Thanks
Tim
I can only use IE6 on my home computer, and the space you describe doesn't show there, nor in Firefox. I will check on the business computer when I get time and see if I can see it in IE7.
Call me stupid but could anyone please explain how to change subcat name to image.
define ('CAT_BOX_HEADING_1_5','1|0|image1.jpg|Some tekst|text |3');
this doesn't work at all
What i want is to show on subcategory 1_5 that is called CAR, the image of a CAR, instead of text CAR.
Tnx
That is not handled by the defines; if you save an image named catimg1_5.gif in
/includes/templates/your_template/buttons/english/, it will be detected and used in place of the text.
Thank you very much
Limelites -
I just noticed your posts 758/759 and the issue you reported. I had noticed the bullet issue when looking at something else.
It turns out that your modifications put the entire categories content inside the #catLinks <ul>, so items were a level deeper than they should be and some styling changed because of this.
You haveat the end of tpl_categories.php, but you should have moved that up along with the rest of the links code.PHP Code:if (SHOW_CATEGORIES_BOX_SPECIALS == 'true' or SHOW_CATEGORIES_BOX_PRODUCTS_NEW == 'true' or SHOW_CATEGORIES_BOX_FEATURED_PRODUCTS == 'true' or SHOW_CATEGORIES_BOX_PRODUCTS_ALL == 'true') {
$content .= '</ul>';
}
You should havePHP Code:
$content = "";
$prev_cat_depth = -1;
$content .= '<div id="' . str_replace('_', '-', $box_id . 'Content') . '" class="sideBoxContent">' . "\n";
// display a separator between categories and links
$content .= '<ul class="catLinks">';
if (SHOW_CATEGORIES_BOX_SPECIALS == 'true') {
$cat_box_link_head = cat_box_heading('SPECIALS');
$content .= $cat_box_link_head[1];
$show_this = $db->Execute("select s.products_id from " . TABLE_SPECIALS . " s where s.status= 1 limit 1");
if ($show_this->RecordCount() > 0) {
$content .= '<li><a class="category-links" href="' . zen_href_link(FILENAME_SPECIALS) . '">' . CATEGORIES_BOX_HEADING_SPECIALS . '</a>' . '</li>' . "\n";
}
}
if (SHOW_CATEGORIES_BOX_PRODUCTS_NEW == 'true') {
// display limits
// $display_limit = zen_get_products_new_timelimit();
$display_limit = zen_get_new_date_range();
$show_this = $db->Execute("select p.products_id
from " . TABLE_PRODUCTS . " p
where p.products_status = 1 " . $display_limit . " limit 1");
if ($show_this->RecordCount() > 0) {
$cat_box_link_head = cat_box_heading('NEW');
$content .= $cat_box_link_head[1];
$content .= '<li><a class="category-links" href="' . zen_href_link(FILENAME_PRODUCTS_NEW) . '">' . CATEGORIES_BOX_HEADING_WHATS_NEW . '</a>' . '</li>' . "\n";
}
}
if (SHOW_CATEGORIES_BOX_FEATURED_PRODUCTS == 'true') {
$show_this = $db->Execute("select products_id from " . TABLE_FEATURED . " where status= 1 limit 1");
if ($show_this->RecordCount() > 0) {
$cat_box_link_head = cat_box_heading('FEATURED');
$content .= $cat_box_link_head[1];
$content .= '<li><a class="category-links" href="' . zen_href_link(FILENAME_FEATURED_PRODUCTS) . '">' . CATEGORIES_BOX_HEADING_FEATURED_PRODUCTS . '</a>' . '</li>' . "\n";
}
}
if (SHOW_CATEGORIES_BOX_PRODUCTS_ALL == 'true') {
$cat_box_link_head = cat_box_heading('ALL');
$content .= $cat_box_link_head[1];
$content .= '<li><a class="category-links" href="' . zen_href_link(FILENAME_PRODUCTS_ALL) . '">' . CATEGORIES_BOX_HEADING_PRODUCTS_ALL . '</a>' . '</li>' . "\n";
}
if (SHOW_CATEGORIES_SEPARATOR_LINK == '1') {
$content .= '<hr id="catBoxDivider" />' . "\n";
}
for ($i=0;$i<sizeof($box_categories_array);$i++) {
switch(true) {
//lots of code
if (SHOW_CATEGORIES_BOX_SPECIALS == 'true' or SHOW_CATEGORIES_BOX_PRODUCTS_NEW == 'true' or SHOW_CATEGORIES_BOX_FEATURED_PRODUCTS == 'true' or SHOW_CATEGORIES_BOX_PRODUCTS_ALL == 'true') {
$content .= '</ul>';
}
if (SHOW_CATEGORIES_BOX_SPECIALS == 'true' or SHOW_CATEGORIES_BOX_PRODUCTS_NEW == 'true' or SHOW_CATEGORIES_BOX_FEATURED_PRODUCTS == 'true' or SHOW_CATEGORIES_BOX_PRODUCTS_ALL == 'true') {
above the links and
$content .= '</ul>';
}
below them:PHP Code:$content = "";
$prev_cat_depth = -1;
$content .= '<div id="' . str_replace('_', '-', $box_id . 'Content') . '" class="sideBoxContent">' . "\n";
//--------------------------------------open #catLinks conditional---------------------------------------
if (SHOW_CATEGORIES_BOX_SPECIALS == 'true' or SHOW_CATEGORIES_BOX_PRODUCTS_NEW == 'true' or SHOW_CATEGORIES_BOX_FEATURED_PRODUCTS == 'true' or SHOW_CATEGORIES_BOX_PRODUCTS_ALL == 'true') {
//--------------------------------------open #catLinks conditional---------------------------------------
// display a separator between categories and links
$content .= '<ul class="catLinks">';
if (SHOW_CATEGORIES_BOX_SPECIALS == 'true') {
$cat_box_link_head = cat_box_heading('SPECIALS');
$content .= $cat_box_link_head[1];
$show_this = $db->Execute("select s.products_id from " . TABLE_SPECIALS . " s where s.status= 1 limit 1");
if ($show_this->RecordCount() > 0) {
$content .= '<li><a class="category-links" href="' . zen_href_link(FILENAME_SPECIALS) . '">' . CATEGORIES_BOX_HEADING_SPECIALS . '</a>' . '</li>' . "\n";
}
}
if (SHOW_CATEGORIES_BOX_PRODUCTS_NEW == 'true') {
// display limits
// $display_limit = zen_get_products_new_timelimit();
$display_limit = zen_get_new_date_range();
$show_this = $db->Execute("select p.products_id
from " . TABLE_PRODUCTS . " p
where p.products_status = 1 " . $display_limit . " limit 1");
if ($show_this->RecordCount() > 0) {
$cat_box_link_head = cat_box_heading('NEW');
$content .= $cat_box_link_head[1];
$content .= '<li><a class="category-links" href="' . zen_href_link(FILENAME_PRODUCTS_NEW) . '">' . CATEGORIES_BOX_HEADING_WHATS_NEW . '</a>' . '</li>' . "\n";
}
}
if (SHOW_CATEGORIES_BOX_FEATURED_PRODUCTS == 'true') {
$show_this = $db->Execute("select products_id from " . TABLE_FEATURED . " where status= 1 limit 1");
if ($show_this->RecordCount() > 0) {
$cat_box_link_head = cat_box_heading('FEATURED');
$content .= $cat_box_link_head[1];
$content .= '<li><a class="category-links" href="' . zen_href_link(FILENAME_FEATURED_PRODUCTS) . '">' . CATEGORIES_BOX_HEADING_FEATURED_PRODUCTS . '</a>' . '</li>' . "\n";
}
}
if (SHOW_CATEGORIES_BOX_PRODUCTS_ALL == 'true') {
$cat_box_link_head = cat_box_heading('ALL');
$content .= $cat_box_link_head[1];
$content .= '<li><a class="category-links" href="' . zen_href_link(FILENAME_PRODUCTS_ALL) . '">' . CATEGORIES_BOX_HEADING_PRODUCTS_ALL . '</a>' . '</li>' . "\n";
}
if (SHOW_CATEGORIES_SEPARATOR_LINK == '1') {
$content .= '<hr id="catBoxDivider" />' . "\n";
}
//--------------------------------------close #catLinks conditional---------------------------------------
$content .= '</ul>';
}
//--------------------------------------close #catLinks conditional---------------------------------------
for ($i=0;$i<sizeof($box_categories_array);$i++) {
switch(true) {
Glen, thanks for that. It worked a treat :-)
Since I haven't found the concentrated time to properly update the mod in Free Addons, the zip of v2.7.3 is here for now.
I am building a cart with a main menu styled by Categories Dressing.
In Firefox, all is well, no matter how far down I drill into the subcategories and products.
In IE7, though, as I drill down, the size of the subcategories listings changes, gradually added space to the RIGHT of the menu, so that there is a gap between the menu and the next (main) div.
I have played around with the Web Dev extension in FF to try to pinpoint the problem, to no avail. The IE7 dev tools are kind of klunky and useless in trying to find the problem
It seems when I try to increase the padding of the subcats, it just pushes the size of the containing box outward instead of closing the "gap." Not a live site, so I can't post URL. I'll try to post screen capture later.
TIA for your ideas.
Hi Glenn,
If you have time, please have a look back to post #779 ...
Thanks
Tim
Categories Dressing v2.7.3 has been submitted to Free Addons and should be available from there soon.
Hello,
I have a question about the border that is around the categories.
Sorry if it has been asked before, but I cant find anything about it.
I'm new to this stuff so I might have even been searching for the wrong terms.
How do I remove the border around the categories?
Here is an image so you know what I mean. The arrows are pointing to the border I am talking about.
http://www.pointsrus.com/images/cdq.jpg
Thanks,
Jordin
Find in your stylesheet_categories_dressing.css:and change theCode:#categories ul {/*top category lists*/
list-style: none;
background: none;
border: 1px solid #ffaa99;
margin: 0 0 0.4em 0;
padding: 0;
}
border: 1px solid #ffaa99;
to
border: none;
pixelwrangler -
It sounds as if the subcats have a fixed width which gets the list indent added. Padding in that case would just increase the space taken by the subcats. I don't know why IE would handle it differently from FF, though.
A screenshot would be helpful, as well as any CSS you have changed from default.
Glenn,
I am sorry for asking this but is there a dumbed down version of Categories Dressing?
I spent a good 3-4 hours trying to figure out the soft ware but couldn't. I managed to install other modifications but once I had Dressing installed, I now had floating bars and random spaced out categories.
All I need to do is add one non linked word to my categories and space them out a bit better.. it would be nice..
Do you have a version for dumb :censored: like me who are not very computer savvy? :( I have the program installed just cant figure out how I can use it?
Good think I keep back up I had to restore all the old files to stop the floating. :frusty:
:sigh:
nisdats
I forgot to say "thank you" for making this available. I know it was a lot of work. I am just really frustrated in not being able to use it..
the site I am working on is called "www.fuelpumpsusa.com" and my categories are on the left. Im attaching a picture of how I wanted them to look. Just need some words in between the two sections..
thank you so much for any tips,
PLEASE talk like you are talking to a 5 year old. :dontgetit
I can follow instructions just fine but get lost in php, etc.
nisdats
There are two possible ways to do this.
If you want the "Select Your Car" text always visible under the "Walbro" category, you would use the "subtext" feature for Walbro (category id 17).
If you want the "Select Your Car" only when the subcats are showing, you would add it as a "heading" to the first subcat in the list, Acura (currently category id 11).
Looking at the site live, I see that it is not set up as the image implies. The image looks like the car brands are subcategories of Walbro, but the site has them as top categories. Which do you want? I can't give correct advice until I know that.
thx for the reply. I need them to be two separate sections, both are top level.
Just need a space b/w them and maybe a nice border for each.
thanks again for your help,
nisdats
Then you would use the category group feature, starting a new group with Acura and giving it the heading text. You would style that group name in your stylesheet, where you can give it a margin-top. You would give top category lists a border, and set subcategory lists to border: none; (examples in stylesheet_categories_dressing.css).
Hi Glen, I was trying to apply a small change to my left sidebox... was trying to make the background of the complete left column a very light grey just to differentiate slightly more... but when I apply a background-color to .leftBoxContainer I get this effect:
http://www.limelites.co.uk/screen111.jpg
I tried to apply the same color to #chcategories and a number of other #ch areas but none of them seem to hit the mark... I bet you know what to change without even having to look in Firebug?
Hi Glen, found it, so no need to trouble you sorry...
#chcategories ul ul a {
Hi Glen,
On a related point, what's wrong with this CSS:
hr.catBoxDivider1 {
padding-right:13px;
}
I'm trying to centre the category dividers horizontally as you'll see they're hitting the right side of the column and they're 17px off the left.....
The above change seems to have zero effect though?