Page 1 of 10 123 ... LastLast
Results 1 to 10 of 2267

Hybrid View

  1. #1
    Join Date
    Jul 2005
    Location
    Upstate NY
    Posts
    22,010
    Plugin Contributions
    25

    Default Categories Dressing

    The Categories Dressing mod is now available in Downloads > Sideboxes.

    This is a mix-and-match group of alterations you can make to the appearance of the standard Zen Cart "Categories" sidebox.
    Each alteration can be repeated with different characteristics, or omitted if not wanted.
    - You can add dividers and/or non-linked headings in any desired locations.
    - You can add images to these headings.
    - You can replace any desired category names with image links.
    - You can give a desired style to any of these alterations using your stylesheet.

    This mod does not provide a specific style, unlike BetterCategories; it simply provides a set of tools to easily give your own style to the Categories box.

    Please post any comments, problems or requests for additional functionality here.

  2. #2
    Join Date
    Jun 2007
    Posts
    7
    Plugin Contributions
    0

    Default Re: Categories Dressing

    HI,

    I just downloaded your Mod and I find it very useful. But I have one question. How can i get rollover effects using this mod?

    Would be very kind If you could get me a hint

  3. #3
    Join Date
    Jul 2005
    Location
    Upstate NY
    Posts
    22,010
    Plugin Contributions
    25

    Default Re: Categories Dressing

    Rollover effects don't involve the code introduced by this mod - they are available on any installation of Zen Cart.

    You can apply the "hover" pseudo-class to any link, in this case a.category-top, a.category-subs and a.category-products, like this:
    PHP Code:
    a.category-top:hovera.category-subs:hovera.category-products:hover {
        
    colorred;
        
    font-weightbold;
        } 
    to treat all of the varieties the same. You can give each one its own declaration if you want them to behave differently.


    You can also use

    a.category-subs, a.category-products { }

    to give subcategories a different style from top cats.
    Last edited by gjh42; 8 Jun 2007 at 06:36 PM.

  4. #4
    Join Date
    Jun 2007
    Posts
    7
    Plugin Contributions
    0

    Default Re: Categories Dressing

    Sure, this will only work with text links, won't it?
    But I use the mod to have category Images. How can I get those rollover effects to work with my images?

    I appreciate ur help.

  5. #5
    Join Date
    Jul 2005
    Location
    Upstate NY
    Posts
    22,010
    Plugin Contributions
    25

    Default Re: Categories Dressing

    Rollover image swapping is something I haven't worked on yet. One way to accomplish it would be with Javascript code, which I know very little about.

    Another way would be to modify the "catimgxx.gif" generator to create a custom id tag instead. This could then have a background image assigned to each category in the stylesheet, which could be swapped on hover.
    I'll work on this, but no promises on timetable.

  6. #6
    Join Date
    Jun 2007
    Posts
    7
    Plugin Contributions
    0

    Default Re: Categories Dressing

    Quote Originally Posted by gjh42 View Post
    Rollover image swapping is something I haven't worked on yet. One way to accomplish it would be with Javascript code, which I know very little about.

    Another way would be to modify the "catimgxx.gif" generator to create a custom id tag instead. This could then have a background image assigned to each category in the stylesheet, which could be swapped on hover.
    I'll work on this, but no promises on timetable.
    Sounds great. Hope this feature request will get into the modification.
    Really hope so

  7. #7
    Join Date
    Mar 2007
    Posts
    104
    Plugin Contributions
    0

    Default Re: Categories Dressing

    3 things I would like to do...

    This is the site: www.starzbodyjewelry.com

    1. Make my Top Categories 'non-linked' *(un-clickable). But you can click on the sub-categories below the category heading.

    2. Is there anyway to 'hide' the subcategories of a sub-category on the main menu?

    3. The top nav bar is not ez-pages, its cat-tabs. How can I put 'Home' on the far left, and 'Contact Us' on the far right?

    Here's the code for my tpl_categories.php file.

    <?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 $
    * Modified for Categories Dressing v2.0 by Glenn Herbert (gjh42) 2007-07-13
    */
    $disp_block = '';
    $disp_block = '<br />'; //if not using display: block; in stylesheet, uncomment this line
    $content = "";

    $content .= '<div id="' . str_replace('_', '-', $box_id . 'Content') . '" class="sideBoxContent">' . "\n";
    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-bodyjewelry';
    break;
    case ($box_categories_array[$i]['path'] == 'cPath=4'):
    $new_style = 'category-hiphopjewelry';
    break;
    case ($box_categories_array[$i]['path'] == 'cPath=5'):
    $new_style = 'category-misc.';
    break;
    case ($box_categories_array[$i]['path'] == 'cPath=1'):
    $new_style = 'category-newarrivals';
    break;
    case ($box_categories_array[$i]['path'] == 'cPath=36'):
    $new_style = 'category-packagedeals';
    break;
    case ($box_categories_array[$i]['path'] == 'cPath=2'):
    $new_style = 'category-closeout';
    break;
    case ($box_categories_array[$i]['top'] == 'true'):
    $new_style = 'category-top';
    break;
    case ($box_categories_array[$i]['has_sub_cat']):
    $new_style = 'category-subs';
    break;
    default:
    $new_style = 'category-products';
    }
    $current_path = str_replace("cPath=","",$box_categories_array[$i]['path']);
    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 {
    // categories dressing - add divider above specified cats
    if(in_array($current_path, explode(",",'3,22,21_56'))) { //replace numbers with your cat ids separated by commas
    $content .= '<hr class="catBoxDivider" />' . "\n";
    }
    //categories dressing - add (divider and) heading above a cat
    $disp_block_head = '';
    //$disp_block_head = '<br />'; // for heading not block uncomment this line
    switch ($current_path) {
    case '23': //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>':'Heading 1</span>' . $disp_block_head) . "\n";
    break;
    }
    // categories dressing - category name mods
    $cat_name_display = $box_categories_array[$i]['name'];
    $cat_img_bg = '';
    // 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
    }
    $content .= '<a class="' . $new_style . $cat_img_bg . '" 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">' . $cat_name_display . '</span>';
    } else {
    $content .= '<span class="category-subs-selected">' . $cat_name_display . '</span>';
    }
    } else {
    $content .= '<span class="category-not-selected">' . $cat_name_display . '</span>';
    } // category name mods

    if ($box_categories_array[$i]['has_sub_cat']) {
    $content .= CATEGORIES_SEPARATOR;
    }
    $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 .= $disp_block . "\n";

    // categories dressing - add subtext below a cat
    switch ($current_path) {
    case '23': //replace number with your desired cPath
    $content .= '<span class="catBoxSubtext">Subtext for cat 23 escape apostrophe\'s</span>' . $disp_block . "\n";
    break;
    } // subtext
    }
    }

    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 .= '<hr id="catBoxDivider" />' . "\n";
    }
    if (SHOW_CATEGORIES_BOX_SPECIALS == 'true') {
    //$content .= '<span class="catBoxHeading1">' . (file_exists(DIR_WS_TEMPLATE_IMAGES . 'cathead-specials.gif') ? zen_image(DIR_WS_TEMPLATE_IMAGES . 'cathead-specials.gif') . '</span>':'Link Heading</span>' . $disp_block_head) . "\n";// categories dressing - uncomment this line for heading above link
    $show_this = $db->Execute("select s.products_id from " . TABLE_SPECIALS . " s where s.status= 1 limit 1");
    if ($show_this->RecordCount() > 0) {
    $content .= '<a class="category-links" href="' . zen_href_link(FILENAME_SPECIALS) . '">' . CATEGORIES_BOX_HEADING_SPECIALS . '</a>' . $disp_block . "\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 .= '<span class="catBoxHeading1">' . (file_exists(DIR_WS_TEMPLATE_IMAGES . 'cathead-new.gif') ? zen_image(DIR_WS_TEMPLATE_IMAGES . 'cathead-new.gif') . '</span>':'Link Heading</span>' . $disp_block_head) . "\n";// categories dressing - uncomment this line for heading above link
    $content .= '<a class="category-links" href="' . zen_href_link(FILENAME_PRODUCTS_NEW) . '">' . CATEGORIES_BOX_HEADING_WHATS_NEW . '</a>' . $disp_block . "\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 .= '<span class="catBoxHeading1">' . (file_exists(DIR_WS_TEMPLATE_IMAGES . 'cathead-featured.gif') ? zen_image(DIR_WS_TEMPLATE_IMAGES . 'cathead-featured.gif') . '</span>':'Link Heading</span>' . $disp_block_head) . "\n";// categories dressing - uncomment this line for heading above link
    $content .= '<a class="category-links" href="' . zen_href_link(FILENAME_FEATURED_PRODUCTS) . '">' . CATEGORIES_BOX_HEADING_FEATURED_PRODUCTS . '</a>' . $disp_block . "\n";
    }
    }
    if (SHOW_CATEGORIES_BOX_PRODUCTS_ALL == 'true') {
    $content .= '<span class="catBoxHeading1">' . (file_exists(DIR_WS_TEMPLATE_IMAGES . 'cathead-all.gif') ? zen_image(DIR_WS_TEMPLATE_IMAGES . 'cathead-all.gif') . '</span>':'Link Heading</span>' . $disp_block_head) . "\n";// categories dressing - uncomment this line for heading above link
    $content .= '<a class="category-links" href="' . zen_href_link(FILENAME_PRODUCTS_ALL) . '">' . CATEGORIES_BOX_HEADING_PRODUCTS_ALL . '</a>' . "\n";
    }
    }
    $content .= '</div>';
    ?>


    Thanks in Advance!
    LMW1

  8. #8
    Join Date
    Sep 2007
    Posts
    4
    Plugin Contributions
    0

    Default 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

  9. #9
    Join Date
    Jul 2005
    Location
    Upstate NY
    Posts
    22,010
    Plugin Contributions
    25

    Default 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 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.
    Last edited by gjh42; 18 Oct 2007 at 04:50 AM.

  10. #10
    Join Date
    Jul 2005
    Location
    Upstate NY
    Posts
    22,010
    Plugin Contributions
    25

    Default 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
    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.

 

 
Page 1 of 10 123 ... LastLast

Similar Threads

  1. categories dressing
    By fw541c in forum Templates, Stylesheets, Page Layout
    Replies: 3
    Last Post: 19 Nov 2010, 09:29 PM
  2. Categories Dressing
    By wotnow in forum Addon Sideboxes
    Replies: 10
    Last Post: 7 Apr 2010, 03:06 AM
  3. Categories Dressing issue
    By Maynards in forum Addon Sideboxes
    Replies: 0
    Last Post: 13 Mar 2010, 10:51 PM
  4. Categories Dressing
    By Maynards in forum Templates, Stylesheets, Page Layout
    Replies: 0
    Last Post: 12 Mar 2010, 11:05 PM
  5. Categories Dressing
    By PGlad in forum Templates, Stylesheets, Page Layout
    Replies: 0
    Last Post: 7 Aug 2007, 07:05 PM

Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •  
disjunctive-egg
Zen-Cart, Internet Selling Services, Klamath Falls, OR