Forums / Addon Sideboxes / Categories Dressing

Categories Dressing

Views: 532,551

Results 41 to 60 of 2,268
27 Aug 2007, 3:23 PM
#41
gjh42 avatar

gjh42

Black Belt

Join Date:
Jul 2005
Location:
Upstate NY
Posts:
21,876
Plugin Contributions:
8

Categories Dressing

If there is a method you can use to distinguish between subcats you want in different colors, you can replace the selection code ($box_categories_array[$i]['path'] == 'cPath=3_42') with that.
I can't be any more specific without knowing exactly how you want to change colors.

You say "1000 products", but how many subcats do you have?
You don't need to specify every subcat; make a spec that covers them generally, and then specify the exceptions with the code above...

27 Aug 2007, 3:34 PM
#42
miweb avatar

miweb

New Zenner

Join Date:
Jul 2007
Posts:
31
Plugin Contributions:
0

Re: Categories Dressing

I have 17 categories and there are 17 subcats inside so..i need only this 17 subcats to have diferent.

Categorie 1 green(picture)...subcategories will be GREEN
Categorie 2 blue(picture)...subcategorie will be BLUE
etc.

Thank U for you interest!

27 Aug 2007, 4:03 PM
#44
miweb avatar

miweb

New Zenner

Join Date:
Jul 2007
Posts:
31
Plugin Contributions:
0

Re: Categories Dressing

I have 17 TOPcat and they have lots of subcategories.

For example TOPcat ONE has 2 subcategories which all of them I need to have green.

TOPcat TWO has only products inside (40 products) - this background colour I need to have blue

TOPcat THREE has 7 subcategories which I need to have Black...etc etc.

Simply said...I need to have every subcategory the same colour as have its TOPcategorie.

[IMG]http://img159.imageshack.us/img159/1402/screen1kc7.th.jpg[/IMG]

27 Aug 2007, 6:21 PM
#46
gjh42 avatar

gjh42

Black Belt

Join Date:
Jul 2005
Location:
Upstate NY
Posts:
21,876
Plugin Contributions:
8

Re: Categories Dressing

I couldn't locate the exampe I had previously worked out like this, so had to redo it...
You will modify this section of tpl_categories.php:

  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: A.category-holiday
// 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=3'):
//        $new_style = 'category-holiday';
//        break;
      case ($box_categories_array[$i]['top'] == 'true'):
        $new_style = 'category-top';
        break;
      case ($box_categories_array[$i]['has_sub_cat']):
        $new_style = 'category-subs';
        break;
      default:
        $new_style = 'category-products';
    }

This code will return just the top category id for whatever the current cat is:

$current_top = str_replace(strstr("_",$box_categories_array[$i]['path']),"",str_replace("cPath=","",$box_categories_array[$i]['path']));

Insert this between the "for" and "switch" statements.

    case ($current_top == '3'):
        $new_style = 'category-subof3';
        break;  

Insert one of these for each top cat you wish to distinguish, in the spot noted. They must be in exactly this location to work correctly.

  for ($i=0;$i<sizeof($box_categories_array);$i++) {
    $current_top = str_replace(strstr("_",$box_categories_array[$i]['path']),"",str_replace("cPath=","",$box_categories_array[$i]['path']));
    switch(true) {
// to make a specific category stand out define a new class in the stylesheet example: A.category-holiday
// 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=3'):
//        $new_style = 'category-holiday';
//        break;
      case ($box_categories_array[$i]['top'] == 'true'):
        $new_style = 'category-top';
        break;
      /* add all individual subcat cases here*/
      case ($current_top == '3'):
        $new_style = 'category-subof3';
        break;  
      case ($box_categories_array[$i]['has_sub_cat']):
        $new_style = 'category-subs';
        break;
      default:
        $new_style = 'category-products';
    }

Style these like

a.category-subof3-text {background-color: #112233;}

a.category-subof4-text {background-color: #223344;}

27 Aug 2007, 6:44 PM
#47
gjh42 avatar

gjh42

Black Belt

Join Date:
Jul 2005
Location:
Upstate NY
Posts:
21,876
Plugin Contributions:
8

Re: Categories Dressing

Erratum: the strstr() function is laid out differently from the functions I am used to, so the $current_top statement will need to be changed to this:```php
$current_top = str_replace(strstr($box_categories_array[$i]['path'],"_"),"",str_replace("cPath=","",$box_categories_array[$i]['path']));

I have not tested this whole setup, and it is possible that strstr() may cause an error in top cats. This error may or may not matter in execution; please post with any results, and I will debug if needed.
27 Aug 2007, 10:52 PM
#48
miweb avatar

miweb

New Zenner

Join Date:
Jul 2007
Posts:
31
Plugin Contributions:
0

Re: Categories Dressing

I don't know how to say it but....YOU ARE GENIUS :bigups:
Oh man...I am so happy! You helped a lot!

31 Aug 2007, 10:17 PM
#49
starrz avatar

starrz

New Zenner

Join Date:
Aug 2007
Posts:
12
Plugin Contributions:
0

Re: Categories Dressing

I was wondering if you were limited by button size to the size of the sample buttons or can you use any size buttons you want to use?

31 Aug 2007, 10:42 PM
#50
gjh42 avatar

gjh42

Black Belt

Join Date:
Jul 2005
Location:
Upstate NY
Posts:
21,876
Plugin Contributions:
8

Re: Categories Dressing

Category and heading images can be any size you want.

Be careful not to make them wider than the column/sidebox width is set for, accounting for padding/margins.

If you are using background images, you will of course have to specify the element width and height in the stylesheet, as the background does not take up space by itself.

3 Sep 2007, 2:56 AM
#51
starrz avatar

starrz

New Zenner

Join Date:
Aug 2007
Posts:
12
Plugin Contributions:
0

Re: Categories Dressing

Thanks! :clap:

10 Sep 2007, 3:48 PM
#52
boggled avatar

boggled

Zen Follower

Join Date:
Mar 2006
Location:
Tennessee
Posts:
286
Plugin Contributions:
0

Re: Categories Dressing

This mod appears to be exactly what I need, but before installing I have a question.

Is it compatible with the BetterCategoriesEZ mod?
If it's a matter of merging two codes, has anyone else successfully accomplished this?

Thanks!

I'll finish that project tomorrow, I've made enough mistakes today!

10 Sep 2007, 4:56 PM
#53
gjh42 avatar

gjh42

Black Belt

Join Date:
Jul 2005
Location:
Upstate NY
Posts:
21,876
Plugin Contributions:
8

Re: Categories Dressing

Categories Dressing and BetterCategoriesEZInfo are not compatible. Both of them alter the same parts of the code in different ways, so they cannot both function at the same time.

BetterCategories automatically sets up a particular style for the categories box, so if you want that style you can just go ahead and use it. If you want other kinds of mods to categories, Cat Dressing I believe is more versatile.

BetterCategories also includes modular code for other sideboxes like EZ-Pages and Information, so you could (following directions carefully) load only the parts of it that apply to those sideboxes if you want, leaving Cat Dressing to control the Categories box.

13 Sep 2007, 10:57 PM
#54
rwoody avatar

rwoody

Totally Zenned

Join Date:
Aug 2004
Location:
Fountain Hills, AZ
Posts:
476
Plugin Contributions:
0

Re: Categories Dressing

First of all let me say that this is just a wonderful contribution. You solved so many issues I've struggled with in the past - :clap:

I've installed the mod into 1.3.7 - no other mods are installed as of yet. That said I have an odd little issue - I am using the arrow icons on my Topcats, but it is adding this odd little text like arrow just underneath. The odd things is when I tested this locally that did not appear. Can you tell me where that might be coming from so I can squash it?

The other issue is IE6 - it is having a problem maintaining the colors from the categories_dressing.css its grabbing the primary css code for visited and or active links. I've had this problem in other code in the past, and I found by making sure the active was listed it solved it. I did that here, but no joy.

here a link to the site under construction: http://69.50.202.128

Again thank you for such great work!!

13 Sep 2007, 11:18 PM
#55
rwoody avatar

rwoody

Totally Zenned

Join Date:
Aug 2004
Location:
Fountain Hills, AZ
Posts:
476
Plugin Contributions:
0

Re: Categories Dressing

I fixed the IE6 issue, by just making my links consistent. Looks better anyway -

Now I think I see what the issue is on the text arrow, but not quite sure how to fix it. What I would like is a image arrow next the Tops that have Subs (which they all will) the text arrow is the indicator that there are sub-cats and it just wraps on long cat titles. How can I make that go away and have an icon to the left much they way it appears once the Top Cat is selected.

Hope I'm clear - IP again is http://69.50.202.128 to my test server

Thanks Again... I'm having so much fun with this mod. :smile:

14 Sep 2007, 6:03 AM
#56
gjh42 avatar

gjh42

Black Belt

Join Date:
Jul 2005
Location:
Upstate NY
Posts:
21,876
Plugin Contributions:
8

Re: Categories Dressing

The text arrows can be turned off in admin > Configuration > Layout Settings > Categories Separator between the Category Name and Count.

These control the subcat prefix and indentation:
Categories Separator between the Category Name and Sub Categories  
Categories SubCategories Indent   

For the arrows on top cats (there should be small arrows just like the All Products link has, which turn to large arrows when selected), apparently your stylesheet has some declaration that overrides the stylesheet_categories_dressing specification. When I add "#categories " to the selectors, they work as designed.

/* bullet for top categories & links:*/

#categories a.category-top-text, #categories a.category-not-selected,  #categories a.category-subs-selected, #categories a.category-links {
    display: list-item;
    list-style: disc inside url(../images/bullet1.gif);
    }
14 Sep 2007, 6:17 PM
#57
rwoody avatar

rwoody

Totally Zenned

Join Date:
Aug 2004
Location:
Fountain Hills, AZ
Posts:
476
Plugin Contributions:
0

Re: Categories Dressing

Now just how perfect is that!!! You are super...:clap:

Thanks sooooooooo much!!!

Ruth

14 Sep 2007, 6:26 PM
#58
rwoody avatar

rwoody

Totally Zenned

Join Date:
Aug 2004
Location:
Fountain Hills, AZ
Posts:
476
Plugin Contributions:
0

Re: Categories Dressing

Spoke too soon. Locally it works just perfect. But on the live site - the little arrow does not appear when not selected. (got rid of those pesky text arrows..thanks)

LOL I will never understand, no matter how many years I do this why something works so perfect on my local Apache and not on the web!! Especially when I direct upload the edited style sheet - so there's no chance for errors or differences.

Any thoughts?

14 Sep 2007, 6:38 PM
#59
gjh42 avatar

gjh42

Black Belt

Join Date:
Jul 2005
Location:
Upstate NY
Posts:
21,876
Plugin Contributions:
8

Re: Categories Dressing

Looking at the CSS in use on your site, it doesn't have the #categories added. Somehow the edited file didn't get to the right place.

The categories styling is in stylesheet_categories_dressing.css, not yet copied into your stylesheet.css. Did you upload both files?

15 Sep 2007, 5:34 AM
#60
rwoody avatar

rwoody

Totally Zenned

Join Date:
Aug 2004
Location:
Fountain Hills, AZ
Posts:
476
Plugin Contributions:
0

Re: Categories Dressing

It absolutely is there. I just did a view stylesheet in FF to make sure it was being seen - and found it there.

Here's the code from that style sheet:

/**
* 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: #a99f92;
    }

.catBoxHeading1 { 
    font-family: 'times new roman', serif;
    font-weight: bold;
    font-size: 1.3em;
    color: #996633; 
    background-color: #a99f92;
    /*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*/
    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: #999999; 
    display: block;
    padding: 0.1em 0.2em 0.1em 1.0em;
    }  

/*display all cat box links as block*/
#categories a {
    background-repeat: no-repeat;
    display: block;
    }
	
/*example for individual category as bg image*/
a.catBg25 {
    background-image: url(../images/catbg25.gif);
    height: 30px;
    }

a.catBg25:hover {
    background-image: url(../images/catbg25hover.gif);
    }
	
/*example for custom individual category styling
a.category-holiday {
    border-top: 3px dotted #112233; 
    background-color: #aabbff; 
    color: #112233; 
    padding: 1em 0em;
    } 
	*/
/* example for  top category styling */
a.category-top-text, a:visited category-top-text, a:active category-top-text  {
    color: #a99f92;
    font-weight:bold; 
    } 

a.category-subs-text, a.category-products-text  {
     color: #999999;  
  } 

/* 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 {
    background-color: #cccccc; 
    color: #996633; 
    background-image: url(../images/catbghover.gif);
    } 
	
a.category-subs-text:hover, a.category-products-text:hover  {
    color: #996633;  
} 

/* bullet for top categories & links:*/
#categories a.category-top-text, #categories a.category-not-selected,  #categories a.category-subs-selected, #categories a.category-links {
    display: list-item;
    list-style: disc inside url(../images/bullet1.gif);
    }
.category-subs-selected	{
	font-weight:normal;
}
/*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*/
/*
#categories a.category-links {
    display: list-item;
    list-style: disc inside url(../images/bullet4.gif);
    }
*/

I had it loaded as an additional style sheet, but I noticed that the instructions were really to add these styles to the existing style sheet, which I have done, an d removed the separate sheet, but it has made no difference.

Please note that the #categories is in fact noted.

Thanks so much for your assistance.

Ruth