Forums / Addon Sideboxes / Categories Dressing

Categories Dressing

Views: 532,551

Results 81 to 100 of 2,268
4 Oct 2007, 7:11 AM
#81
gjh42 avatar

gjh42

Black Belt

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

Categories Dressing

You can even strip some more off of what you posted. This will do all the job you appear to be wanting:```
.catBoxHeading1 {
font-family: arial,verdana,helvetica, sans-serif;
font-weight: bold;
font-size: 1em;
color: #00FF00;
margin-top: 2px;
margin-bottom: 2px;
}

5 Oct 2007, 12:20 AM
#82
relentless avatar

relentless

New Zenner

Join Date:
Sep 2007
Posts:
56
Plugin Contributions:
0

Re: Categories Dressing

Do I put the Mod Re: Categories Dressing, includes in /public_html [root?]

This is tpl_categories.php --- is this correct.

case '28': //replace number with your desired cPath
//$content .= '<hr class="catBoxDivider" />' . "\n"; // to add divider uncomment this line
$content .= '<span class="catBoxHeading1">' . (file_exists(DIR_WS_TEMPLATE_IMAGES .
'cathead' . $current_path . '.gif') ? zen_image(DIR_WS_TEMPLATE_IMAGES . 'cathead' . $current_path . '.gif') .
'</span>':'Air Conditioning<br />Split System<br />Ducted</span>' . $disp_block_head) . "\n";
break;
case '34': //replace number with your desired cPath
//$content .= '<hr class="catBoxDivider" />' . "\n"; // to add divider uncomment this line
$content .= '<span class="catBoxHeading1">' . (file_exists(DIR_WS_TEMPLATE_IMAGES .
'cathead' . $current_path . '.gif') ? zen_image(DIR_WS_TEMPLATE_IMAGES . 'cathead' . $current_path . '.gif') .
'</span>':'Split System AC<br />Heat Pumps<br /> Ducted</span>' . $disp_block_head) . "\n";
break;
}
case '28': and case '34': are the categories ID of the categories,
that I would like the Headings to appear above,
if I understand the changes to tpl_categories.php correctly.

5 Oct 2007, 5:50 AM
#83
gjh42 avatar

gjh42

Black Belt

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

Re: Categories Dressing

That is correct.

You can upload the /includes/ folder to /public_html/, or just upload tpl_categories.php to /includes/templates/your_template/sideboxes/tpl_categories.php if you prefer.

6 Oct 2007, 12:05 AM
#84
relentless avatar

relentless

New Zenner

Join Date:
Sep 2007
Posts:
56
Plugin Contributions:
0

Re: Categories Dressing

Glenn
Your Categories Dressing Mod, worked, first time, out of the box.
with the simple, addition of <br /> to all Category names,
and [Headings text in tpl_categories.php],
to put the Headings, and links on there own lines.

Headings text in, tpl_categories.php]
Air Conditioning <br />
Split Systems <br />
Ducted <br />
In Catalog= Category/Products
Category name
1 to 2 Tons <br />

Thank you for your help

9 Oct 2007, 2:27 AM
#85
gjh42 avatar

gjh42

Black Belt

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

Re: Categories Dressing

It is designed to use "block" display (allowing for such things as a colored background, box or button of uniform appearance), which by default disables the built-in stock <br /> tags, and uses the CSS in the example stylesheet.

If you wish not to have block-style display, just edit tpl_categories.php to uncomment the two lines for $disp_block and $disp_block_head as the readme instructs. (You will still need the <br /> tags between the parts of a heading:

Air Conditioning <br />
Split Systems <br />
Ducted

)

9 Oct 2007, 4:45 AM
#86
funkmanusa avatar

funkmanusa

New Zenner

Join Date:
Sep 2007
Posts:
38
Plugin Contributions:
0

Re: Categories Dressing

Great MOD, I really appreciate the contribution.

I have everything working except the category image headings.

I have the correct lines uncommented in the stylesheet_categories_dressing.css
and the images uploaded. The tpl_categories.php has been overwritten.

The image swap from your mod is working perfectly, but the images for the
category heads do not appear?

Any suggestions as to where I messed up? :unsure:

Heres a link to my poor cart in progress:
http://www.citysatchel.com/zen-cart/

9 Oct 2007, 7:12 AM
#87
gjh42 avatar

gjh42

Black Belt

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

Re: Categories Dressing

You have an expanded categories mod installed, which gives you a different id than #categories:```html

<!--// bof: chcategories //--> <div class="leftBoxContainer" id="chcategories" ``` I think if you edit the stylesheet, replacing #categories with #chcategories in Cat Dressing areas, you will see your images.
9 Oct 2007, 4:00 PM
#88
lmw1 avatar

lmw1

Zen Follower

Join Date:
Mar 2007
Posts:
105
Plugin Contributions:
0

Re: Categories Dressing

Can somebody Pleeeese explain to me in detail how to accomplish this? I am using the Categories Dressing Mod. Nothing else.

*See attached image.

Thanks in advance!
Len

9 Oct 2007, 7:26 PM
#89
gjh42 avatar

gjh42

Black Belt

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

Re: Categories Dressing

From your previous posts, the "Body Jewelry" and "Hip-Hop Jewelry" are top categories, not static headings. This function is not covered by Categories Dressing. I see now that you have eliminated all the custom categories styling you had, and also changed around the category arrangement, making everything top cats. I can't properly give advice when I don't know how your categories will end up. If you rearrange things the way they were, reinstall the expanded categories mod you had, and follow the advice in Static Category Headings? Link header to main page?, post #10, about tags, I will give you code that will do the job. There are at least two ways to do it, depending on how your categories are arranged.

9 Oct 2007, 9:43 PM
#90
funkmanusa avatar

funkmanusa

New Zenner

Join Date:
Sep 2007
Posts:
38
Plugin Contributions:
0

Re: Categories Dressing

gjh42:

You have an expanded categories mod installed, which gives you a different id than #categories:```html

<!--// bof: chcategories //--> <div class="leftBoxContainer" id="chcategories" ``` > I think if you edit the stylesheet, replacing #categories with #chcategories in Cat Dressing areas, you will see your images.

Thanks for the reply GJH, I didnt even think about the expanded categroies being installed, I was using the mod and decided against using it, but forgot it was still in there.

I tried your suggestion modifying everthing in the stylesheet_categories_dressing.css file as described, but it didnt work for me.

Heres the modified css

/**
* 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: #aabbcc;
    }
*/
.catBoxHeading { 
    font-family: 'times new roman', serif;
    font-weight: bold;
    font-size: 1.4em;
    color: #333333 
    background-color: #ff66ff;
    background-image: url(../images/catbg25.gif);  
    height: 23px;  
    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: #333333; 
    background-color: #ffddff;
    display: block;
    padding: 0.1em 0.2em 0.1em 1.0em;
    }  

/*display all cat box links as block*/
#chcategories a {
    background-repeat: no-repeat;
    display: block;
    }
	
/*example for individual category as bg image*/

/* example for  top category styling */
a.category-top-text {
    /*background-color: #ccddff;*/
        font-family: arial, verdana, helvetica, sans-serif;
	font-size: 13px;
	color: #333333; 
	padding-top: 0.2em;
	padding-right: 0pt;
	padding-bottom: 0pt;
	padding-left: 0em;
	margin-top: 0pt;
	margin-right: 0pt;
    margin-bottom: 0pt;
    margin-left: 0pt;
    display: block;
    height: 1.8em;
    border-bottom-width: 1px;
    border-bottom-style: solid;
    border-bottom-color: #9a9a9a;
    background-color: #eeeeee;
    background-image: url(../images/boxlistbg.gif);
    background-repeat: no-repeat;
    background-attachment: scroll;
    background-x-position: 0.4em;
    background-y-position: 0.5em;


/*margin: 0.2em 0;*/
    /*padding: 0.2em 0.3em;*/
    } 

a.category-subs-text, a.category-products-text  {
    /*background-color: #ff69ff;*/
    color: #6699aa;  
    /*margin: 0.2em 0;*/
    /*padding: 0.2em 0.3em;*/
    } 

/* 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 {
    font-family: arial, verdana, helvetica, sans-serif;
	font-size: 13px;
	background-color: #ff4872;
    color: #ffffff; 
	display: block;
	font-weight: bold;
    background-repeat: no-repeat;
    background-attachment: scroll;
    background-x-position: 0em;
    background-y-position: 0em;
	font-weight: bold;
	} 
	
a.category-subs-text:hover, a.category-products-text:hover  {
    background-color: #ff69ff;
    color: #ffffff;  
    margin: 0.2em 0;
    padding: 0.2em 0.3em;
    } 

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

#chcategories a.category-links {
    display: list-item;
    list-style: disc inside url(../images/bullet4.gif);
    }
*/

And heres my site again in case. http://www.citysatchel.com/zen-cart

Im gonna go through and try to remove any residuals of the expanded category mod to see if that works. ANy other suggestions?

Thanks again for your help!

10 Oct 2007, 6:16 AM
#91
gjh42 avatar

gjh42

Black Belt

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

Re: Categories Dressing

For clarification, by "category image heads", do you mean the top category names, or non-linked headings you want above some category names?
And are you wanting to use foreground images for these, or background images with hover effects?

12 Oct 2007, 4:32 PM
#92
ceegeeaar avatar

ceegeeaar

New Zenner

Join Date:
Mar 2007
Location:
Deep in the Black Country, UK
Posts:
34
Plugin Contributions:
0

Re: Categories Dressing

Im having a problem with this. I have it set up nicely and it works well with firefox but when the page is viewed in IE the styling is gone plus the subcategories are not on separate lines. Its as if IE isnt reading the css file.
Ive copied the css into the main css file and deleted the included one.

Have you any idea what could be causing this?

15 Oct 2007, 12:30 PM
#93
ceegeeaar avatar

ceegeeaar

New Zenner

Join Date:
Mar 2007
Location:
Deep in the Black Country, UK
Posts:
34
Plugin Contributions:
0

Re: Categories Dressing

False alarm :blush:

I found a stray apostrophy in the css!

17 Oct 2007, 8:53 PM
#94
ant avatar

ant

New Zenner

Join Date:
Sep 2007
Posts:
4
Plugin Contributions:
0

Re: Categories Dressing

Hi,
Thanks for this module. I am new to Zen cart and I was not too sure about some of the posts.

1 - Is it possible to assign a specific image for each category? (i.e. cat 1 => image 1, Cat 2 => image 2, etc.)
2 - Is it possible to assign different images to each category depending on the language ?
3 - Is it possible to display a different image when the moouse rolls over (depending on the language)?

If any of the above is possible, could you please explain how to set it up?

Many thanks in advance.

Regards,
Antoine

18 Oct 2007, 3:45 AM
#95
gjh42 avatar

gjh42

Black Belt

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

Re: Categories Dressing

1: Yes, this is one of the basic functions of Categories Dressing. Name your images correctly and place them in the correct directory, and they will automatically be used. See the readme in the download for details.

2: As originally written, the code does not support multiple languages. It is a very easy fix to achieve this, however. The image files are called for in several places in the code; replace each instance of

DIR_WS_TEMPLATE_IMAGES . '

with

DIR_WS_TEMPLATE . 'buttons/' . $_SESSION['language'] . '/

and place the image files in
/includes/templates/your_template/buttons/your_language/.

3: This will require a bit more customizing, as the stylesheet can't use $_SESSION['language'].

In tpl_categories.php, this section, for example, php // categories dressing - display image if exists for category name if (file_exists(DIR_WS_TEMPLATE_IMAGES . 'catimg' . $current_path . '.gif')) { $cat_name_display = zen_image(DIR_WS_TEMPLATE_IMAGES . 'catimg' . $current_path . '.gif'); // categories dressing - display background image if exists for category name } elseif (file_exists(DIR_WS_TEMPLATE_IMAGES . 'catbg' . $current_path . '.gif')) { $cat_name_display = ''; $cat_img_bg = ' catBg' . $current_path; } else { $cat_img_bg = '-text';//append to main classname } will become```php
// categories dressing - display image if exists for category name
if (file_exists(DIR_WS_TEMPLATE . 'buttons/' . $_SESSION['language'] . '/catimg' . $current_path . '.gif')) {
$cat_name_display = zen_image(DIR_WS_TEMPLATE . 'buttons/' . $_SESSION['language'] . '/catimg' . $current_path . '.gif');
// categories dressing - display background image if exists for category name
} elseif (file_exists(DIR_WS_TEMPLATE . 'buttons/' . $_SESSION['language'] . '/catbg' . $current_path . '.gif')) {
$cat_name_display = '';
$cat_img_bg = ' catBg' . $current_path . '-' . $_SESSION['language'];
} else {
$cat_img_bg = '-text-' . $_SESSION['language'];//append to main classname
}

-your_language 
to the end of class tags.

In the stylesheet, replace each instance of 

url(../images/

with

url(../buttons/your_language/

You will need a separate declaration for each language.

/example for individual category as bg image/
a.catBg25 {
background-image: url(../images/catbg25.gif);
height: 30px;
}
will become

/example for individual category as bg image/
a.catBg25-english {
background-image: url(../buttons/english/catbg25.gif);
height: 30px;
}

a.catBg25-french {
background-image: url(../buttons/french/catbg25.gif);
height: 30px;
}

19 Oct 2007, 5:25 PM
#96
gjh42 avatar

gjh42

Black Belt

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

Re: Categories Dressing

After some more thought, I realized that it will be easier than I have indicated to support multiple languages.

The
DIR_WS_TEMPLATE . 'buttons/' . $_SESSION['language'] . '/
will be needed just as shown above, but the rest of the PHP code does not need to be changed.

For all background images (which are specified in the stylesheet), you can create a language-specific stylesheet and place appropriate versions of the declarations in it. So in your base stylesheet.css for your default language, you will have ```

/example for individual category as bg image/
a.catBg25 {
background-image: url(../buttons/english/catbg25.gif);
height: 30px;
}
and for your alternate language (say French) you will have /includes/templates/your_template/css/french_stylesheet.css (all lowercase). In that you will change the url of the background image:
/example for individual category as bg image/
a.catBg25 {
background-image: url(../buttons/french/catbg25.gif);
height: 30px;
}


Note: I believe this to be correct, but have not yet tested it. If anyone does this, please post here to confirm that it works or troubleshoot if it doesn't.
26 Oct 2007, 3:44 AM
#97
wewuvanimals_com avatar

wewuvanimals_com

New Zenner

Join Date:
Oct 2007
Posts:
19
Plugin Contributions:
0

Re: Categories Dressing

Ahhhhhh! I just downloaded this and am reading the readme file under the instructions: "To display images in place of selected category names". I am sooo confused! There are so many things going on there and I have no idea what to do! I mean, I want to be able to have category images instead of just regular text sooo bad I'll pay someone to write me instructions that I can understand!

Please help! :shocking:

26 Oct 2007, 4:09 AM
#98
wewuvanimals_com avatar

wewuvanimals_com

New Zenner

Join Date:
Oct 2007
Posts:
19
Plugin Contributions:
0

Re: Categories Dressing

Okay, wait...I think I am *starting * to get it now...but, why aren't the pictures showing up? I didn't make any original pictures for my site yet. But, I should see the already made ones that can with the Category Dressing Download, right?

Here is my URL: https://www.wewuvanimals.com/store

Why aren't I seeing the defult pictures you included in the download, Glenn?

26 Oct 2007, 6:58 AM
#99
gjh42 avatar

gjh42

Black Belt

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

Re: Categories Dressing

Because the example images are set up for the category id's in the demo products package, and your categories don't include any of the same id's.

If you rename some of the example images to category id's that you have on your site, you will see them replacing text.

The readme includes descriptions of how each modification is done in the code, but you don't need to study that part. Concentrate on the directions for naming images and the like, and don't worry about the modifications that you are not interested in using.

26 Oct 2007, 6:55 PM
#100
wewuvanimals_com avatar

wewuvanimals_com

New Zenner

Join Date:
Oct 2007
Posts:
19
Plugin Contributions:
0

Re: Categories Dressing

gjh42:

Because the example images are set up for the category id's in the demo products package, and your categories don't include any of the same id's.

If you rename some of the example images to category id's that you have on your site, you will see them replacing text.

The readme includes descriptions of how each modification is done in the code, but you don't need to study that part. Concentrate on the directions for naming images and the like, and don't worry about the modifications that you are not interested in using.

Sorry if this sounds stupid but...how do I find out the cateorgy id's I have on my site?