-
Re: Categories Dressing
Changing "inside" to "outside" in list-style:
will take care of that.
You will then need to refigure left margins. Make configuring easier by altering the style property wording a bit:
Code:
#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 5.0em;
padding: 0;
}
For the individual category rules, make the rule apply only to the marker url:
Code:
#categories li.cat-vouchers a {
list-style: disc inside url(../images/cat1.gif);
padding: 0em 0em;
}
/*change all individual cat rules as below*/
#categories li.cat-uniforms a {
list-style-image: url(../images/cat2.gif);
}
If you want to improve the vertical alignment of the bullets and text, you will need to move the list styling from the <a> back to the <li>. This will not be difficult; let me know if you need help.
-
Re: Categories Dressing
cheers Glenn, thanks for the help, but I am totally lost at the moment??? I tried changing to ouside url but lost the icons altogether then changed it back as it was. I think i am out of my depth???
-
Re: Categories Dressing
You need to make all the changes shown in post 1051 to get the icons to work as desired. One at a time will make it messy.
-
Re: Categories Dressing
Aha seem to have got it this time, just need to get it so that the text is aligned vertically with the icon rather than flowing onto another line below the level of the icon. Does this make sense??? So that the text and icon are level with each other vertically aligned centrally???
-
Re: Categories Dressing
"If you want to improve the vertical alignment of the bullets and text, you will need to move the list styling from the <a> back to the <li>."
Code:
#categories ul {/*top category lists*/
list-style: none disc outside url(../images/bullet1.gif);
background: none;
border: none;
margin: 0 0 0.45.0em 0;
padding: 0;
}
#categories ul a {/*top categories*/
display: list-item block;
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 5.00.4em;
padding: 0;
}
For the individual category rules, make the rule apply to the list item instead of the link:
Code:
/*change all individual cat rules as below*/
#categories li.cat-uniforms a {
list-style-image: url(../images/cat2.gif);
}
There will be some other places you need to change along with these, following the same principle.
-
Re: Categories Dressing
I have tried changing the bits as described, but no change in the vertical alignment has happened, all I got was a white space at the bottom of the categories box???
Is it actually possible to align the text with the centre of the icon vertically???
-
Re: Categories Dressing
Definitely not if you have two lines of text, and with the size of the icon I don't think it is going to align with a single line either. I will have to play with some positioning styling and see what can be done, but am heading out of town for the weekend.
-
Re: Categories Dressing
I have a problem :(
I just installed this on my other website, which is in 3 languages. I copied the categories_dressing_defines.php to reflect all languages.
And i wrote all teh headings in it.
It looks like this:
HTML Code:
<?php
/**
*
* @copyright Copyright 2009 Glenn Herbert
* @copyright Portions 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.7.3 - Glenn Herbert (gjh42) - 20090505
* includes/languages/english/extra_definitions/your_template/categories_dressing_defines.php
*/
//example defines - copy & modify for each category desired
define ('CAT_BOX_HEADING_#','group|divider/class|[imgname]|[imgalt][|headcontent|headclass][|headcontent|headclass]...');
define ('CAT_BOX_HEADING_1','1|0||');//new list - no headings
define ('CAT_BOX_HEADING_9','1|0|||Supplies|1');//new list - text headings - multiple levels - styles 1 & 2
define ('CAT_BOX_HEADING_109','1|0|||Boro Glass|2');
define ('CAT_BOX_HEADING_2','1|0|||Education|3');
define ('CAT_BOX_HEADING_1','1|0|||Tools|4');
define ('CAT_BOX_HEADING_6','1|0|||Kilns|5');
define ('CAT_BOX_HEADING_141','1|0|||Members|6');
define ('CAT_BOX_HEADING_11','1|0|||Metals|7');
define ('CAT_BOX_HEADING_94','1|0|||Other|8');
define ('CAT_BOX_HEADING_7','1|0|||Soft Glass|9');
define ('CAT_BOX_HEADING_23','0|1|||none|2');//no list break - divider and text heading - style 2
define ('CAT_BOX_HEADING_33_34','0|0|||Subcat Heading|3');//simple text heading - style 3
define ('CAT_BOX_HEADING_48','1|0|cathead48.gif|Cat 48 Heading|Buy Now...|3');//image heading and alt text - can be followed by text heading(s)
define ('CAT_BOX_HEADING_52','0|1||');//divider only - style 1
define ('CAT_BOX_HEADING_53','0|2||');//divider only - style 2
define ('CAT_BOX_HEADING_FEATURED','0|0|||Featured Heading|3');//no list break - text heading
define ('CAT_BOX_SUBTEXT_23','Subtext for cat 23 escape apostrophe\'s|1');//subtext - style 1
//
//display only the active top category and its subs, hide top cats, hide sub-subcats, or any combination.
//only uncomment and set this define if you want to hide cats based on active tree or level
// 'active|highest_level|deepest_level'
//active: 0=all tops/1=full active tree only/2=active only (all tops when no cat selected)/
//3=full active tree, others per level/4=like 3, active branches only/5=like 1, no tops|
//highest_level: 0=all levels/1=no topcats/etc.|
//deepest_level: 1=only first subcats/2=first & second subcats/etc.
//
//define('CAT_BOX_ACTIVE_LEVEL', '0|1|9');//hide top cats
//define('CAT_BOX_ACTIVE_LEVEL', '1|0|1');//show only active cats, to first subcat level
?>
But when you go to the website it only shows the first 2 headings. What did i do wrong? http://www.fritenglas.eu/index.php?m...ex&language=EN
Als the big spacing between Beadliner & Tools and Books
This is an excisting shop and i need this to be altered asap, please can i get soem help ( again ):cry:
-
Re: Categories Dressing
Never mind the above! However i have another strange problem.
I sorted all my sub categories as the should show in the categorie listing. As follows going from top to bottom of the listing:
Supplies
EyeWear (1)
Supplies (1)
Torches (1)
Boro Glass
Frit (2)
Murrini (2)
Rods (2)
Shards (2)
Education
Books (3)
DVD's (3)
Magazines (3)
Workshops (3)
Tools
Beadliner (4)
Electroforming (4)
Optic Molds (4)
Presses (4)
Tools (4)
Kilns
Kiln Supplies (5)
Paragon (5)
Uterm (5)
Members
Members (6)
Metals
Copper & Brass (7)
Silver - Gold - Palladium (7)
Other
Gift Vouchers (8)
Zirconias (8)
Soft Glass
Aventurine (9)
Enamels (9)
Frit (9)
Murrini & Millifiori (9)
Pixie dust (9)
Rods (9)
Sample packs (9)
Shards & Confettie (9)
But when you see the categorie listing it shows an ALL different thing.
As ou can see at this link http://www.fritenglas.eu/index.php?m...ex&language=EN
How on earth is this possible. And more important how can i change it to my liking?
Thanks
-
Re: Categories Dressing
Hi Glen, great mod. How do i get the entire categories to display all the time, the complete tree always open to show top categories and sub categories, i only have main categories and sub categories. I would like them all open all the time on all pages including the homepage.
I've played around with the three numbers (0|0|0) and have put them into every configuration i can think of but i either get nothing displaying or just main categories displaying.
I've switched back to the regular categories stylesheet until i can sort this, any help is greatly appreciated.
http://www.smokin-paint.com