Results 1 to 6 of 6
  1. #1
    Join Date
    Mar 2009
    Posts
    59
    Plugin Contributions
    0

    Default Ways to style CURRENT category menu choice?

    Is there a way to style the category menu choice of the current page (i.e., the one that is currently displayed) so that CSS can be used to emphasize the user's place in menu navigation? Just a way to style the category menu so that it reflects what's shown in the breadcrumb trail.

    Is plain old HTML pages, all you need to do is this:

    <ul>
    <li>First menu choice</li>
    <li class="selected">second menu choice</li>
    <li>third menu choice</li>

    And then to emphasize the current choice:

    li.selected {
    color:red;
    background: yellow;
    }

    Can't see any obvious way to do this in ZC. I'm using Categories Dressing, which is just perfect for the rest of the menu styling. But there doesn't seem to be any way to target the current page so that the menu choice for it can be emphasized.

    TIA for your suggestions!

  2. #2
    Join Date
    Jan 2004
    Location
    N of San Antonio TX
    Posts
    9,105
    Plugin Contributions
    11

    Default Re: Ways to style CURRENT category menu choice?

    It is easier for us to look at possibilities with a URL.

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

    Default Re: Ways to style CURRENT category menu choice?

    These lines in stylesheet_categories_dressing.css can be modified to indicate the current category path:
    Code:
    /*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*/
        }

  4. #4
    Join Date
    Mar 2009
    Posts
    59
    Plugin Contributions
    0

    Default Re: Ways to style CURRENT category menu choice?

    Site is not live, but here's the problem:


  5. #5
    Join Date
    Mar 2009
    Posts
    59
    Plugin Contributions
    0

    Default Re: Ways to style CURRENT category menu choice?

    Thank you! I knew it was in there - it just wasn't clear to me exactly how to target it.

    I'm going to have to play around with the cascade to see if I can just get the CURRENT link to style differently. Right now, I have the all of the category listings in the link path styled to reflect "where you are" to the user, but I have to make just the LAST link distinctive.

    Thanks again for your help!

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

    Default Re: Ways to style CURRENT category menu choice?

    #categories li a.cat-selected-text {} can only apply to the immediate selected category (since it is open to products), but
    #categories li a.cat-parent-text {} can apply to the selected category or to any of its parents. Not sure at the moment if there is a handle to distinguish between those cases.

 

 

Similar Threads

  1. v153 Can anyone help me on my category menu style? Thank you.
    By mdivk in forum Templates, Stylesheets, Page Layout
    Replies: 6
    Last Post: 21 Mar 2015, 02:20 PM
  2. v151 Display Current Category Image in Custom Menu
    By Enzo in forum Templates, Stylesheets, Page Layout
    Replies: 2
    Last Post: 29 Jun 2014, 03:50 PM
  3. Flyout Menu highlight current category
    By scott_ease in forum Templates, Stylesheets, Page Layout
    Replies: 5
    Last Post: 28 Jul 2012, 06:06 PM
  4. v138a Replace header with apycom jQuery Menu Style 01 (flyout menu))
    By soki in forum Templates, Stylesheets, Page Layout
    Replies: 0
    Last Post: 18 Mar 2012, 09:18 PM
  5. Removing menu choice bullet images
    By cbh in forum Basic Configuration
    Replies: 0
    Last Post: 7 Dec 2007, 05:42 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