Printable View
Back from a weekend away, and will take these in order.
Limelites - You can add "subtext" to the Hire Products category and put your link HTML in the define for the subtext, or add a heading above the next category for your link code.
define('WHAT_EVER', '<a href="index.php?main_page=coming_soon">Coming Soon</a>');
WHAT_EVER should be the appropriate kind of constant for the location and category desired, like examples in categories_dressing_defines.php.
You can add a heading to the All Products link in the latest version of Cat Dressing.Quote:
I'd like it to appear at the top of the group (above all products).
Littlekid440 - You can eliminate the margins, padding, borders, etc. for the categories sidebox so that the groups can be styled to look like separate boxes, and occupy the full box width.
#categories {margin: 0; padding: 0; border: none;}
#categoriesHeading {display: none;}
#categoriesContent {padding: 0;}
and so on.
Dutchy - You can address top categories with
li.cat-top {background: etc;}
hardwiredtemplates - You have the Categories Dressing stylesheet active, but the other files are not active. Some other categories-affecting mod is controlling the actual sidebox output, and the Cat Dressing classes and ids are not there for the stylesheet to use.
You do not need to activate anything in admin for Cat Dressing to work.
Thanks Glen so my question at this point is how do I make the other files active where do I go?Quote:
Originally Posted by gjh42
Thanks glen
If they are installed in your current template folders as the readme instructs, they will be active. You have different files now, at least /includes/templates/your_template/sideboxes/tpl_categories.php, (from some other mod) in your current template folder.
I'll continue to search but this is a fresh website and as for mods all I have is the footer menu mod and no other mods except of course the categories dressing mod.Quote:
Originally Posted by gjh42
I'll probably have to remove the mod then try to re-install it once again.
I see you have Cat Dressing properly installed now.
Thank you! I was missing the li.Quote:
Originally Posted by gjh42
what a fool I am! There are a lot of ppl here that would be seriously stuck without you to help us. Thanks again.
The li isn't necessarily essential - it's just a bit more specificity, which in this case may have been enough to override a more generic rule that only specified a classname or element type.
a.cat-top would not have worked at all, because the <a> element is not named cat-top, the <li> element is.
Hi Glen, welcome back! I missed your reply. Works a treat:Quote:
Originally Posted by gjh42
define ('CAT_BOX_HEADING_349','0|0||| <a href="index.php?main_page=coming_soon">Coming Soon</a>|3||');
.catBoxHeading3 {
background-color: #F9F7FD;
color: #FFFFFF;
font-family: inherit;
font-size: 1.1em;
font-weight: bold;
margin-top: 0;
padding-bottom: 5px;
}
HI,
I have depart my categories into several categories as fellow on my website:
1.Top Brands;
2.Mens & Women Shop;
3.Shoes Styles;
4.Others Shoes;
All the categories show normally except 2.Mens & Women Shop.
It always show Major Heading Minor Heading.
I have rename them at:define ('CAT_BOX_HEADING_3','1|0|||Major Heading|1|Minor Heading|2');//new list - text headings - multiple levels - styles 1 & 2.
But it still show Major Heading Minor Heading.:blink:
Pls tell me how to do.:smile:
Tks.
HI,
I have depart my categories into several categories as fellow on my website:
1.Top Brands;
2.Mens & Women Shop;
3.Shoes Styles;
4.Others Shoes;
All the categories show normally except 2.Mens & Women Shop.
It always show Major Heading Minor Heading.
I have rename them at:define ('CAT_BOX_HEADING_3','1|0|||Major Heading|1|Minor Heading|2');//new list - text headings - multiple levels - styles 1 & 2.
But it still show Major Heading Minor Heading.
Pls tell me how to do.:smile:
Tks.
Let me see your website so I can tell what the cause of your problem is.So what does the define for CAT_BOX_HEADING_3 look like now?Quote:
I have rename them at:define ('CAT_BOX_HEADING_3','1|0|||Major Heading|1|Minor Heading|2');//new list - text headings - multiple levels - styles 1 & 2.
But it still show Major Heading Minor Heading.
TksQuote:
Originally Posted by gjh42
CAT_BOX_HEADING_3 now is:
define ('CAT_BOX_HEADING_3','0|0|||Mens & Women & Kids Shop|1');//no list break - divider and text heading - style 1
This is my website:http://www.bestfty.com
:smile:
You have other custom headings working there, so all I can say is that that particular define did not make it into the file version on the server. Or you might still have the original definition above the new one so that the new definition would fail to be processed.
Thank you.Quote:
Originally Posted by gjh42
I would find it out.:cool:
The mod looks promising, but I cannot get it to work at all. I copied all the files and in admin panel it shows the option to show all subcategories too, but when I put this in my template's header.tpl:
it just gives these errors error:PHP Code:require($template->get_template_dir('tpl_categories.php',DIR_WS_TEMPLATE, $current_page_base,'sideboxes'). '/tpl_categories.php');
Notice: Undefined variable: box_id in /home/XXX/XXX/templates/XXX/sideboxes/tpl_categories.php on line 20
and:
Notice: Undefined variable: box_categories_array in /home/koulu116/public_html/includes/templates/sarianna/sideboxes/tpl_categories.php on line 22
Any suggestions?
Why are you trying to call tpl_categories.php from tpl_header.php? It is a sidebox mod which works with existing sidebox files, and will not work in the header without significant tweaking and additional files.
What exactly do you want to accomplish?
Well, I've used other sideboxes succesfully in header before, didn't this would be that much different. I stand corrected. I try to accomplis a dynamic categories menu (horizonta) that lists all categories and has drop downs for subcategories.
With this mode I would've been easy to use custom css and styles to do the dropdown.
Some sideboxes may function by the tpl_ file calling the module file, but the categories box does not. You might be able to require /includes/modules/sideboxes/categories.php which would then call up tpl_categories.php. I haven't investigated what other dependencies there are that might be disrupted by using the box outside a sidebar. This line needs $column_box_default to be defined, which may not be the case in the header:PHP Code:require($template->get_template_dir($column_box_default, DIR_WS_TEMPLATE, $current_page_base,'common') . '/' . $column_box_default);
Ok, I understand. I have actually used the module with a custom tpl to get categories, but haven tried to get sub categories with the same code - a bit changed of course.
Well, I reckon, I try something else to get the job done.
Hi,
I've recently installed Categories Dressing on my zencart...
apparently it split my categories into groups/sub-groups and added some other functions that I don't want on my website...
here is what I need to do
1) group categories back together
2) delete minor headings
3) delete unwanted text
can you please advice how to accoumplish the above...
I've attacehd a snapshot of my categories box for your review and comments
Thanks
The readme.html has complete instructions for removing demo features that you don't want. Look at the bold paragraphs at the bottom of various sections.
gjh42,
I was able to apply some customization through categories_dressing_defines.php
I am still struggling with the following
1. Move a category after the text
2. how to change category shown as an image back to regular link
I've attached a snapshot to further explain my requirements
Thanks
To remove the demo image, comment out the define for CAT_BOX_HEADING_3.
If you got the Sub Category heading by defining it for the Miscellaneous category, just change the define to use the id of the Combinations... category. I can't be more specific without seeing your site live.
gjh42,
I've already commented out CAT_BOX_HEADING_3 (actually I've commented out everything except for CAT_BOX_SUBTEXT_23) in categories_dressing_defines.php file but the icon is still there...
Plus I am still struggling to group products before and after CAT_BOX_SUBTEXT_23 text...
my website is gPakistan.com... Please review and advice
Thanks again for all your assistance I really appreciate it...
Oops, sorry about the CAT_BOX_HEADING_3... I wasn't thinking about what it is (a category name replacement, not a heading image). The way to get rid of that is to delete the relevant image from /includes/templates/your_template/buttons/english/.
So you defined the Sub Category as subtext, not as a heading. If you want it above the Combinations... link, you need to change the define to be a heading.Quote:
">Combinations...</a><div class="catBoxSubtext1">Sub Category</div></li>
PHP Code:define ('CAT_BOX_HEADING_23','0|0|||Sub Category|2');//no list break or divider - text heading - style 2
by deleting catimg3.gif, should I be able to see my category as a regular link and not as an image...?
Thanks
That's what I said:)
gjh42,
It worked... Thanks
when I roll my mouse over a category it shows some dashes at the top and dots at the bottom of the category to highlight the selection...
may I know how to disable it...?
thnaks
never mind... I found the solution for it...
I commented out hover effects in stylesheet_categories_dressing.css file
Thanks
I just had this installed on my site, I did not do the install. When I check my site on Internet Explorer http://www.lotionsgalore.com/ , it shows the pink color rather then the yellow that was added and the dividers are also missing. When I view the site https://www.lotionsgalore.com/ , with http(s), is shows correctly! How can I fix this so http://www.lotionsgalore.com shows correctly?
Hi
Categories dressing is installed and working without problems on a 139h cart. It's set up to hide the top category.
These are the settings being used.
define ('CAT_BOX_HEADING_32_10','1|0|||Frames|1');//new list - text headings - multiple levels - styles 1 & 2
define('CAT_BOX_ACTIVE_LEVEL', '0|1|1');//hide top cats
The majority of categories have sub categories.
My question:
How do we get a category to show if it will never be having any sub-categories?
I have Template Monster template (theme490) which I read in this thread that could be an issue with tpl_categories.php and getting this mod to work. All I want to do is have the top level categories have background images w/ hover. No subcats or anything else. I have uploaded my images and updated stylesheet_categories_dressing.php to reference the images. Below is my tpl_categories code. Can someone please tell me how to make this mod work with Template Monster as well as how to configure categories_dressing_defines.php? My categories are simply 1-6.
<?php
/**
* Side Box Template
*
* @package templateSystem
* @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 $
*/
$content = "";
$content .= '<div id="' . str_replace('_', '-', $box_id . 'Content') . '" class="sideBoxContent">' . "\n";
$content .= '<ul>' . "\n";
$li_class="";
$levels = array();
$j = 0;
foreach($main_category_tree->tree as $key => $value){
for ($i=0;$i<sizeof($box_categories_array);$i++){
if($box_categories_array[$i]['path'] == 'cPath=' . $value['path']){
$levels[$i] = $value['level'];
}
}
$j++;
}
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'):
if($i == 0)
{
$new_style = 'category-top_un';
$li_class='<li class="category-top_un"><span class="top-span">';
break;
}
else{
$new_style = 'category-top';
$li_class='<li class="category-top"><span class="top-span">';
break;
}
case ($box_categories_array[$i]['has_sub_cat']):
$new_style = 'category-subs';
$li_class='<li class="category-subs" style="padding-left:' . 15 * ($levels[$i]) . 'px"><span class="top-span">';
break;
default:
$new_style = 'category-products';
$li_class='<li class="category-products" style="padding-left:' . 15 * ($levels[$i]) . 'px"><span class="top-span">';
break;
}
if (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)) {
// skip if this is for the document box (==3)
} else {
$content .= $li_class;
$content .= '<a class="' . $new_style . '" href="' . zen_href_link(FILENAME_DEFAULT, $box_categories_array[$i]['path']) . '">';
if ($box_categories_array[$i]['current']) {
if ($box_categories_array[$i]['has_sub_cat']) {
$content .= '<span class="category-subs-parent-selected">' . $box_categories_array[$i]['name'] . CATEGORIES_SEPARATOR . '</span>';
} else {
$content .= '<span class="category-subs-selected">' . $box_categories_array[$i]['name'] . '</span>';
}
} else {
if ($box_categories_array[$i]['has_sub_cat']) {
$content .= '<span class="category-subs-parent">' . $box_categories_array[$i]['name'] . CATEGORIES_SEPARATOR .'</span>';
} else
$content .= $box_categories_array[$i]['name'];
}
$content .= '</a>';
if (SHOW_COUNTS == 'true') {
if ((CATEGORIES_COUNT_ZERO == '1' and $box_categories_array[$i]['count'] == 0) or $box_categories_array[$i]['count'] >= 1) {
$content .= CATEGORIES_COUNT_PREFIX . $box_categories_array[$i]['count'] . CATEGORIES_COUNT_SUFFIX;
}
}
$content .= '</span></li>';
}
}
$content .= '</ul>' . "\n";
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') {
// display a separator between categories and links
if (SHOW_CATEGORIES_SEPARATOR_LINK == '1') {
$content .= '<div id="catBoxDivider"></div>' . "\n";
}
$content .= '<div class="box_body_2"><ul>';
if (SHOW_CATEGORIES_BOX_SPECIALS == 'true') {
$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) {
$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) {
$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') {
$content .= '<li><a class="category-links" href="' . zen_href_link(FILENAME_PRODUCTS_ALL) . '">' . CATEGORIES_BOX_HEADING_PRODUCTS_ALL . '</a></li>' . "\n";
}
$content .= '</ul></div>';
}
$content .= '</div>';
?>
t.harrison - You have a customized tpl_categories.php from the TM template, which has totally different code from the Categories Dressing version. They cannot be used together; you have to use one or the other. There would be no point in merging them, since they do some of the same things in different ways. If you want the whole category link to change appearance on hover, you would have to use Cat Dressing. If you just want the background to change on hover and not the text, you might be able to style the TM elements. That would be a subject for a new thread, as it is off topic for this thread.
buildingblocks - You might make your lone category into a subcategory of a "dummy" top cat, but that would have repercussions elsewhere in the page display. The best way would be to edit categories_dressing_functions.php and add a new case to the switch that mimics case 1 with the addition of a test to handle your special category. That is the outline of the approach; I could work up the exact code to use if you need more help.
Does anyone have any advice on using Categories Dressing with a template that already includes a tpl_categories.php?
In particular, I'm using Lite Red from 12leaves.com
I am using version 1.3.9h
This is a simple question..I just have no idea where to do this.
I want to change my sub categories that appear in middle of the page (not in the categories menu) to images.
Can someone help me out with this?
This has nothing whatever to do with Categories Dressing, but if you post your question in an appropriate forum and let me know where the new post is, I will look at it. You should give a location where we can see it live for the best advice relevant to your site. It will probably be a simple addition to one PHP file, or possibly just to the stylesheet.
fred_tededmondsson - You would need to identify how the template's version of tpl_categories.php is different from stock (by comparing them), and then merging the essential differences into the Categories Dressing version of tpl_categories.php. If the template version involves mostly the container for the categories, you may be able to use the parts that make it match other sideboxes; if the template version affects the structure of the categories themselves, you cannot merge the two and will have to scrap the template version. In this case, both versions are manipulating the same elements in different ways, and only one method can be used.
webdca - See this thread for some answers to your question: Removing Name under "Section Image"
Hello,
I just installed categories dressing...I like the default menu EXCEPT when you roll over, there are these weird characters /// }{}{} ..
How can I remove these?
There shouldn't be any such characters. Can we see the site live to understand what you are referring to? Do you perhaps mean little hash marks at top and possibly bottom of the category space? That would be a background image to highlight the hovered link. I don't remember its name offhand, but if you look at the stylesheet for :hover rules, you should find references to a url in background: or background-image: properties.
Hello, I believe this will be the first of many newbie questions to come about your add-on. I appreciate the time and patience.
In the installation instructions there is a line that states: "Activate the chcategories sidebox as described in readme_ch_categories.txt"
I'm not even sure where I the readme_ch_categories.txt is. I would appreciate someone pointing me in the right direciton. Thank you.
That readme file was inadvertently left out of the v2.7.3 release, but it has no important information that is not available elsewhere.
You activate a sidebox in admin > Tools > Layout Boxes Controller.
GJH42: www.restaurantstore(dot)ca
Notice when you roll over categories it is displaying the weird roll over..
thank you for the help...next question. I can't seem to see where I can change the sidebox size in the css, could someone help me out with the proper place to define this? Also, I would only like one level of category shown in the sidebox for right now. I know there are instructions on this that I believe look like this.
The category display-limiting define takes this form:
define('CAT_BOX_ACTIVE_LEVEL', 'active|highest_level|deepest_level');
The "active" field controls whether categories outside the current active tree will display: 0=all tops/1=full active tree only/2=active tree only (all tops when no cat selected)/3=full active tree, others limited per level controls/4=like 3, active branches only/5=like 1, no tops.
The "highest_level" field controls whether top categories will display: 0=all levels/1=no topcats/etc.
The "deepest_level" field controls whether subcategories will display: 1=only first subcats/2=first & second subcats/.../9=all levels down to 9.
How do you want to change the sidebox size? Height? Width?
If you want only top categories showing, that is best done with the admin setting in Configuration > Layout Settings > Categories - Always Open to Show SubCategories > set to 0.
webdca - I am not seeing any characters/marks on hover, in Firefox or IE9 regular or compatibility view.
Thanks for the info. I'd like to change the sidebox width if possible.Quote:
Originally Posted by gjh42
That's not actually related to Categories Dressing, but a general styling ability; you can address the categories sidebox as a whole with
#categories {width: 123px !important;}
@gjh42
I have categories dressing v2_8 installed. I have all my top cats and sub cats1 showing on the home page. A couple of my top cats have more than 10 sub cats1, is there a way to change it to where a max of 10 sub cats1 are displayed on the home page?
That would be new custom coding. I'm not sure offhand where you would get the info, but you would need to add something that keeps a count of subcats of the current top cat and suppress display of ones beyond 10... If there could be sub-subcats processed in there too, it could get really messy. Probably the best way would be to alter the base category-tree class, which I have not done and can't advise on.
Hi guys,
I am using the Uncollapsed Categories Tree. All is working fine. What I would like to do is 'unlink' the top level category, which I don't really need. Currently, if I click on the top level category a page load and lists each subcategory in thumbnail format. It's a bit redundant, as the sub cats are always showing anyway.
Any ideas ? Note that this mod includes a new tpl_categories file
adam
You would need to apply the code described by jackie.taferner in the other thread to v2.7.3's tpl_categories.php, line 51:and line 62:PHP Code:$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']) . '">';
Change toPHP Code:$content .= '</a>';
andPHP Code:if ($box_categories_array[$i]['top'] == 'true') {
$content .= ' <li class="cat-' . $new_style . '"><span class="cat-' . $active_class . $cat_name_display[0] . '">';
} else {
$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']) . '">';
}
You would also need to do some styling to make these spans look as you want, since some of the <a> styling will no longer apply.PHP Code:if ($box_categories_array[$i]['top'] == 'true') {
$content .= '</span>';
} else {
$content .= '</a>';
}
Hi, I have been trying to develop a navigation system for a development site. But I am having limited success.
I have four parent categories which I have displayed across the top of the web page, I am using the Categories Dressing mod set to only show subcategories in the Category Sidebox. This is great and exactly how I want my navigation to be. (See attached)
But I get an empty Category Sidebox on all pages where Subcategories are not displayed (see attached). Can someone please help me and show me where I am going wrong.
How can I have the Category Sidebox turned off or not displayed on pages where Subcategories are not shown? For example, the home, log-in, cart, account, log-off page. EZ-Pages, Define Pages etc.
Failing this I will have to redesign my navigation or styling. :frusty:
I cannot workout how to do it. It is on my local WAMP set up so sadly no live link available.
Thanks
This is not a Categories Dressing issue; you can fix it by editing /includes/modules/sideboxes/your_template/categories.php (not a Cat Dressing file).There might possibly be a product page that doesn't involve a cPath for some kinds of display, so if you don't get the categories sidebox in a place you want it, post back and I'll take a look at adding the right extra condition.PHP Code:* @version $Id: categories.php 2718 2005-12-28 06:42:39Z drbyte $
*/
//add this line to turn sidebox off for non-category/product pages
if ($cPath) {
$main_category_tree = new category_tree;
$row = 0;
$box_categories_array = array();
// don't build a tree when no categories
$check_categories = $db->Execute("select categories_id from " . TABLE_CATEGORIES . " where categories_status=1 limit 1");
if ($check_categories->RecordCount() > 0) {
$box_categories_array = $main_category_tree->zen_category_tree();
}
require($template->get_template_dir('tpl_categories.php',DIR_WS_TEMPLATE, $current_page_base,'sideboxes'). '/tpl_categories.php');
$title = BOX_HEADING_CATEGORIES;
$title_link = false;
require($template->get_template_dir($column_box_default, DIR_WS_TEMPLATE, $current_page_base,'common') . '/' . $column_box_default);
//add this line to turn sidebox off for non-category/product pages
}
?>
Thank you Glenn, that's perfect.
One of this reasons I wanted to disable the top category link is that I have not been able to format that resultant page (the page which loads after clicking the top category link) that way I want.
This resulting page loads the subcategories in a grid, and I can add a subcat image to each via admin, and all is good.
But I find I am not able to format these 'subcategory grid images' independently, without affecting other images. It looks like the overarching class is 'centerBoxWrapperContents". If I want to add an image border to these subcategory images in css using centerBoxWrapperContents img {border: etc... } then in doing so it applies the border to the Featured Product images, standard Product listing images etc. But what if I only want to format the subcat images with their own border. And further, being able to center the subcat grid, without centering the Product listsings etc which looks better floated left.
No big deal, but if you have any thoughts on this, I'd like to hear them.
Thanks again,
Adam.
That's awesome Sir. Thank you.
Worked perfectly!
Quote:
Originally Posted by gjh42
BTW. I you click on a link from the New products or Featured products sidebox or centrebox, the Category Sidebox does not display, even though there is cPath in the URL
/index.php?main_page=product_info&cPath=0&products_id=523
I believe this is because of the value being '0'
But I can live without that! Thanks for the help!!
Well, if you have the sidebox set to show only subcategories of the active top cat, and there is no active top cat (cPath=0), what is going to display in the sidebox?
Unless you want all subcats to show when there is no active top cat, you already have the correct behavior.
Hi, I'm quite new to zencart (and CSS and PHP...) so this might be a silly question, I tried to search on the forum but can't find an answer... :lookaroun
I have installed categories dressing, I switched to images instead of text and all is going well apart from when I try to have a hover effect - the 'main' image displays correctly but when I hover over it shows the default setting (light blue background with little yellow lines and no text).
I have uploaded the catbg2 (which works) and catbg2hover images and added the following to stylesheet_categories_dressing.css:
#categories li a.catBg2 {
background-image: url(../buttons/english/catbg2.gif);
height: 30px;
}
#categories li a.catBg2:hover {
background-image: url(../buttons/english/catbg2hover.gif);
}
Is there anything else I should be doing, or did I do something wrong? The website is here http://ic-blue.co.uk/kat/ (still very much work in progress so please ignore any weirdness!).
Thanks
You put the catbg2 rules in the wrong place, and the :hover is being overridden by a generic rule. Move them down to the place where the sample catbg rules are.The rules in orange are interfering with your rules (in red). Move your rules to the position shown in green.Code:#categories li a.catBg2 {
background-image: url(../buttons/english/catbg2.gif);
height: 30px;
}
#categories li a.catBg2:hover {
background-image: url(../buttons/english/catbg2hover.gif);
}
/*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 {
color: #dd6633;
background: #ddeeff url(../images/catbghover.gif);
}
/* subcategory hover effects*/
#categories li li.cat-subs a:hover, #categories li li.cat-products a:hover {
color: #aa9966;
background: #ffb9ff url(../images/catbghover.gif);
}
/*individual page rules go after the general rules*/
/*example for individual category as bg image*/
#categories li a.catBg25 {
background-image: url(../buttons/english/catbg25.gif);
height: 30px;
}
#categories li a.catBg25:hover {
background-image: url(../buttons/english/catbg25hover.gif);
}
#categories li a.catBg2 {
background-image: url(../buttons/english/catbg2.gif);
height: 30px;
}
#categories li a.catBg2:hover {
background-image: url(../buttons/english/catbg2hover.gif);
}
Thank you so much, that's very helpful! I thought it was something to do with the stylesheet :blush:
CaptainCarlton - The different boxes have their own classes for box content, so you can address them individually.
The subcategory listing is .categoryListBoxContents {}, featured centerbox is .centerBoxContentsFeatured {} and the specials centerbox is .centerBoxContentsSpecials {}.
I said earlier that this would be fairly complex new coding, and it would be if done in PHP, but I just thought of a CSS workaround that may be acceptable for homepage use.Quote:
Originally Posted by autoace
Something likeI haven't tested this; please let me know if it works for you. Your setup might differ slightly and interfere with this as written.Code:#indexHomeBody #chcategories>ul>li+li+li+li+li+li+li+li+li+li+li {display: none;}
hello, in danger of sounding like a wally.... ive seen a few references to version 2.8, the only version i have found in the addons area is 2.73 (last update May 31 2009) is there a link to the newest version or is it a private release?
im using ZC 1.3.9h if this is of any relevance :)
thanks
Edit: Ive found the mod - bah! sorry! :)
Yes, it's in post 1542, for anyone else who wants to know.
Could someone please link me to a site that uses "display images in place of selected category names?" I'd like to see what this looks like........
Ok, I've concocted questions. I've installed this mod on examplecart.com and the first thing I wish to do is set the first level of subcats to display. I see in the readme file that I can replace the "deepest_level" text of my categories_dressing_defines.php with a simple 0 through 9; however, I can't even seen to find this statement below in that file. I feel like I'm missing a major part of the picture here.
define('CAT_BOX_ACTIVE_LEVEL', 'active|highest_level|deepest_level');
Ahhh crap. I was looking in the wrong file.........
And the saga continues... I've made the last two numbers here 2's but still no subcategories are displaying when hovering with my mouse.
//define('CAT_BOX_ACTIVE_LEVEL', '0|1|2');//hide top cats
//define('CAT_BOX_ACTIVE_LEVEL', '1|0|2');//show only active cats, to first subcat level
You can only have one define for this constant. Did you remove the comment marks // before the define you want to activate?
Exactly what kinds of categories do you want to show and when?
I did learn to remove the // marks to make the statement take effect. I want all of the top level categories to display all the time and the 1st level of subcategories to pop up when the user hovers over one of the top level categories
Hi,
Iīm having some problems with categories dressing... Rolover doesnīt work on sub-cats... triple checked everything and canīt fix it. Can someone help please?
The site is online @ http://www.pedradatattoosupplies.com
Best regards
Glenn, are you there?
You will want to set the define as '0|0|1'; ordinary functioning, highest level = top, lowest level = first subcat. This assumes you have the ch_categories files installed, and you have put the rules for flyout given earlier in this thread into your stylesheet.Quote:
I want all of the top level categories to display all the time and the 1st level of subcategories to pop up when the user hovers over one of the top level categories
Hmm.. I'm missing something. I don't have the file ch_categories.php installed because, to my understanding, those three files are only needed if you want all your categories and subcategories to be displaying all at once. If I did that with my real site RedlineStands.com I'd have a menu that was 10 ft tall when you went to the home page. Is the Uncollapsed Categories Tree mod necessary to have a flyout menu? Lastly, am I to understand correct that in order to utilize a flyout menu I must edit the stylesheet_categories_dressing.css and replace all #categories statements with #chcategories? I'm sorry if my questions are stupid. I find this pretty difficult because even though the instructions are well written the lingo is tailored to those who know much more than I. Thanks Glenn; you've been great!
Without the uncollapsed categories, the subcats are not fetched from the database except for the current active ones. So yes, you need that for flyout. And with flyout, you only get one category expanding at a time, so you wouldn't have the big list showing.
The chcategories files include a stylesheet that has already been modified for the #chcategories box id.
Do you recall about where those flyout rules are located in this thread? I've read the readme file a couple times but I never saw anything that appeared to be blatant rules for turning on the flyout mod. I've installed the ch_categories files up to this point.Quote:
Originally Posted by gjh42
Btw, I now have 2 css files: stylesheet_chcategories_dressing.css and stylesheet_categories_dressing.css installed on my server, but I get the feeling that isn't right.
Yes, as the readme says, when you have chcategories installed you should either delete stylesheet_categories_dressing.css or rename it to stylesheet_categories_dressing.bak so it will be ignored.
The flyout styling is given best in post 1750:I had not yet developed the flyout rules when I released v2.7.3, so that would explain why they are not mentioned in the readme:)Code:#chcategories li>ul {display: none;}
#chcategories li:hover {position: relative;}
#chcategories li:hover>ul {
display: block;
position: absolute;
left: 98%;
top: 0;
background: #ffffff;
border: 1px solid #aabbcc;
z-index: 100;
width: 98%;
}
Hi Glenn,
Can you help me out... I canīt my sub cats rollover effect isnīt working. Iīve triple checked everything and canīt figure out whatīs wrong.
The site is http://www.pedradatattoosupplies.com
Thx in advance
Best regards
nummell
So Glenn, do I now remove the "ch" from the new stylesheet to take the place of the one I deleted? I didn't find anything like that in the readme. On the flip side, if we've changed the name of the stylesheet to stylesheet_chcategories_dressing.css don't we need to inform all other files of this? The read me file says, "If you are using Uncollapsed Categories Tree, replace #categories with #chcategories in all examples" though it doesn't say what file it's talking about editing. I added that bit of code from post 1750 to the bottom of my stylesheet_chcategories_dressing.css file, though it did not seem to affect anything. Below is the code to that file as I'm currently using it. I'm really quite lost; is this something I can pay you to install?
/**
* CSS Stylesheet for Categories Dressing examples
* @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
* /includes/templates/your_template/css/stylesheet_chcategories_dressing.css
* Categories Dressing v2.7.3 Glenn Herbert (gjh42) - 20090505
* Alternate version for use with Uncollapsed Categories Tree mod
*/
/*
hr.catBoxDivider1 {
color: #aabbcc;
}
*/
/*IE6 hacks*/
* html #chcategories li, * html #chcategories 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(../buttons/english/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(../buttons/english/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(../buttons/english/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;
}
#chcategories ul {/*top category lists*/
list-style: none;
background: none;
border: 1px solid #ffaa99;
margin: 0 0 0.4em 0;
padding: 0;
}
#chcategories ul a {/*top categories*/
display: list-item;
list-style: disc inside url(../images/bullet1.gif);/*change to list-style: none; to remove bullet*/
background: no-repeat;
border: none;
margin: 0;
padding: 0;
}
#chcategories ul ul {/*subcategory lists*/
list-style: none;
background: #ffeecc;
border: none;
margin: 0 0 0.4em 0;
padding: 0 0 0 1.3em;
}
#chcategories 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:*/
#chcategories 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:*/
#chcategories 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*/
#chcategories li a.cat-parent, #chcategories li a.cat-selected, #chcategories li a.cat-not-selected {
list-style: none;
display: block;/*fix IE6 margin-left bug*/
}
/*different bullet for links if desired*/
/*
#chcategories li a.category-links {
list-style: disc inside url(../images/bullet4.gif);
}
*/
/* top category hover effects*/
#chcategories li.cat-top a:hover {
color: #dd6633;
background: #ddeeff url(../images/catbghover.gif);
}
/* subcategory hover effects*/
#chcategories li li.cat-subs a:hover, #chcategories li li.cat-products a:hover {
color: #aa9966;
background: #ffb9ff url(../images/catbghover.gif);
}
/*individual page rules go after the general rules*/
/*example for individual category as bg image*/
#chcategories li a.catBg25 {
background-image: url(../buttons/english/catbg25.gif);
height: 30px;
}
#chcategories li a.catBg25:hover {
background-image: url(../buttons/english/catbg25hover.gif);
}
/*example for custom individual category styling*/
#chcategories li.cat-holiday a {
border-top: 3px dotted #112233;
background-color: #aabbff;
color: #112233;
padding: 1em 0em;
}
/*From here to */
#chcategories li>ul {display: none;}
#chcategories li:hover {position: relative;}
#chcategories li:hover>ul {
display: block;
position: absolute;
left: 98%;
top: 0;
background: #ffffff;
border: 1px solid #aabbcc;
z-index: 100;
width: 98%;
}
/*Here came from post 1750 of main support thread*/
/*example for custom category group styling*/
ul#catGroup48 {
border: 1px solid #bd6699;
background: #bbeeff;
position: relative;
left: -1.3em;
top: 0.2em;
}
.catCount {color: #000000;}
nummell - I don't see anything wrong with your subcat rollover. It goes to red text with a semitransparent white background, just like your stylesheet calls for:
/* subcategory hover effects*/
#categories li li.cat-subs a:hover, #categories li li.cat-products a:hover {
color: #ff0000;
background: transparent url(../images/catbghover.png);
}
r1formetoo - CSS files that start with "style" are autoloaded, so you don't need to do anything else to/with them.
View source shows that your sidebox is #categories, not #chcategories. Did you activate the chcategories sidebox in Tools > Layout Boxes Controller? The readme mentions this, but doesn't say where to activate it (the readme_ch_categories.txt was left out of the v2.7.3 package).
Ok, so that turned on the chcategories sidebox, which now makes sense to me. However, it for some reason created a nice big white block above my menu.Quote:
Originally Posted by gjh42
Did you have a custom rule for #categories which set margin-top to 0? If so, duplicate it for #chcategories.
I checked my includes/templates/custom/css/stylesheet.css file and searched it for a #categories statement but came up with nothing. Am I looking in the wrong place?Quote:
Originally Posted by gjh42
Ok, I'm finally making some headway getting everything dressed appropriately. However, when I hover over a top level category I still have this white space to the left of all my choices in that pop up box with all my subcategories. I think that white space looks out of place though I have no idea what causes it. What do you think?Quote:
Originally Posted by gjh42
Near the bottom of your stylesheet.css you haveCode:#categories,#information {margin-top: 0;
float:left;}
This is causing the left spacing on subcats:
stylesheet_chcategories_dressing.css (line 90)
#chcategories ul ul {
background: none repeat scroll 0 0 #FFFFFF;
border: medium none;
list-style: none outside none;
margin: 0 0 0.4em;
padding: 0 0 0 1.3em;
}
Adjust as desired.
Wow, not sure how I missed that????????Quote:
Originally Posted by gjh42
Glenn, please have a look at the site examplecart.com now and let me know what you think. I've played with the spacing and colors a bit but I'm still not convinced that it looks as professional as the rest of the site. What do you think of the color choices? I feel like the site looks ok "until" you hover over a category. Then the pop up box shows the subs and I feel that's where things look a bit amateurish. What would you try to give it a tad more professional and flowing look? I'm also interested in seeing how you can use pop up images for sub categories though I've yet to see a site with this in action. Do you know of any?
"Popup images"? Do you mean substituting images for text, or using them for headings? Those are the only ways Categories Dressing uses images...
Hi Glenn,
It only happens in sub cat with background images... it used to work just fine but it stoped working and I canīt figure out whats wrong check here http://pedradatattoosupplies.com/ind...=index&cPath=7
I have 2 sub cat images named correctly (1 regular and another for hover) and it used to work just fine. what can be wrong
Thx in advance
Best regards
nummell
r1formetoo - I played with the styling a bit... see what you think of this.Code:#chcategories ul {/*top category lists*/
list-style: none;
background: none;
border: nono;
margin: 0 0 0.4em 0;
padding: 0;
}
#chcategories ul a {/*top categories*/
display: block;
background: #ffffff;
border: none;
margin: 0;
padding: 0 0.4em;
}
#chcategories ul ul {/*subcategory lists*/
list-style: none;
background: #DCDCDC;
border: none;
margin: 0 0 0.0em 0; /*WAS 0 0 0.4em 0*/
padding: 0 0 0 0.0em; /*WAS 0 0 0 1.3em*/
}
#chcategories ul ul a {/*subcategories*/
display: block;
background: #E9EAEA;
border: none;
margin: 0;
padding: 0;
}
/*change bullet when a category w/o bg image is open to subs:*/
#chcategories li a.cat-parent-text {
color: #000000;
background: #6CbBff;
font-weight: bold;
}
/*change bullet when a category w/o bg image is open to products:*/
#chcategories li a.cat-selected-text {
color: #000000;
background: #6CbBff;
font-weight: bold;
}
...
/* top category hover effects*/
#chcategories li.cat-top a:hover {
color: #000000; /*this is the top level cat text color only when hovering*/
background: #4C9Bff; /*this is the top level cat background color only when hovering*/
}
/* subcategory hover effects*/
#chcategories li li.cat-subs a:hover, #chcategories li li.cat-products a:hover {
color: #000000; /*this is the 1st subcat text color only when hovering*/
background: #4C9Bff; /*this is the 1st subcat background color only when hovering*/
}
...
#chcategoriesContent {padding: 0.4em 0;}
/*From here to */
#chcategories li>ul {display: none;}
#chcategories li:hover {position: relative;}
#chcategories li:hover>ul {
display: block;
position: absolute;
left: 98%;
top: 0;
border: 1px solid #000000;
z-index: 100;
width: 98%;
}
/*Here came from post 1750 of main support thread*/
nummell - The generic subcategory hover effects are overriding the individual hovers. Commenting out that rule brings the hovers back:Or you could just delete the "background" line of the rule, and it would allow the individual ones to work.Code:/* subcategory hover effects*/
/*#categories li li.cat-subs a:hover, #categories li li.cat-products a:hover {
color: #ff0000;
background: transparent url(../images/catbghover.png);
} */