Page 1 of 1

Color Single Category Text

Posted: Fri Aug 20, 2010 5:30 am
by smorelli
Does anyone know how I can get a specific category to be styled? For instance, I have a CLEARANCE category that I would like in bold red. I don't see how I can add a style to that category.

Re: Color Single Category Text

Posted: Fri Aug 20, 2010 8:23 am
by JAY6390
Open

Code: Select all

/catalog/controller/module/category.php
find

Code: Select all

$output .= '<li>'; 
around line 50 and change it to

Code: Select all

$output .= '<li id="category-'.$result['category_id'].'">'; 
then for say category 20, in your stylesheet use the selector

Code: Select all

#category-20 {
    /* STYLE INFO HERE */
}

Re: Color Single Category Text

Posted: Fri Aug 20, 2010 9:01 am
by Maansy
good info Jay :)

Re: Color Single Category Text

Posted: Fri Aug 20, 2010 10:11 pm
by smorelli
Excellent!!!!

Re: Color Single Category Text

Posted: Tue Aug 24, 2010 1:10 pm
by dramony
is there a way where only the main category will be styled and not the sub-categories under it?
thanks!

Re: Color Single Category Text

Posted: Tue Aug 24, 2010 7:18 pm
by JAY6390
Just use a child selector via css
http://www.w3.org/TR/CSS2/selector.html#child-selectors
for example, in the default theme, use

Code: Select all

#category > ul > li
which will only style the first level category list items, not their descendants.

Re: Color Single Category Text

Posted: Tue Aug 24, 2010 8:44 pm
by dramony
not working on my end..

Re: Color Single Category Text

Posted: Tue Aug 24, 2010 9:26 pm
by JAY6390
Not sure then with your stuff, but for example, on the category you can use

Code: Select all

#category > ul > li {
    border: 1px solid black;
}
and get this result
http://screenshots.jaygilford.com/2010-08-24_1425.png

If you want to edit the link tags, you need to use

Code: Select all

#category > ul > li > a

Re: Color Single Category Text

Posted: Wed Aug 25, 2010 8:09 pm
by dramony
Thank you Jay!

I used this code to make the parent category text to bold:

Code: Select all

#category > ul > li > a {
	font-weight:bold;
}

Re: Color Single Category Text

Posted: Wed Aug 25, 2010 8:20 pm
by JAY6390
Ah, figured it was the link not the li you wanted

Re: Color Single Category Text

Posted: Fri Mar 08, 2013 8:20 pm
by k2tec
I editted this line in my controller

Code: Select all

$output .= '<li id="category-'. $result['category_id'].'">';
and build in my CSS

Code: Select all

#category-21 {
	list-style: url('../image/twee.png');
	list-style-position:outside;
}

#category-21 li {
    background:#e9b447;
}
ect, etc. for the next categories

but my problem is that the image in front of my text is not centered
I also tried

Code: Select all

#category-20   {
	background: url('../image/een.png') center left no-repeat;	
}
but then the image is in my text.

does anyone have a solution to this problem