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?

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?

False alarm :blush:

I found a stray apostrophy in the css!

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

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 Code:

---


      // 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 Code:

---

      // 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
      } 


---

using $_SESSION['language'] to add
-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.

Code:

---

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

---

will become

Code:

---

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

---

The same modifications can be applied to other parts of the code, depending on which functions you wish to use.

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

Code:

---

       
/*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:

Code:

---

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

---

so that when French is activated by the user, the French version will be displayed.

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.

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:

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: www.wewuvanimals.com/store

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

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.

Quote:

---

Originally Posted by 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?