CSS Dropdown menu for the header- With Categories!

[DogTags]

Is there a way to add a Down Arrow to top-level menu items that contain sub items? (but not to top items that do not contain sub items)

[jettrue]

Is there a way to add a Down Arrow to top-level menu items that contain sub items? (but not to top items that do not contain sub items)

See if this works:

add this to your stylesheet_header_menu.css:

div#dropMenu li.submenu {background: url(../images/dropmenu.gif) 95% 50% no-repeat;}

The image is attached. It goes in your includes/templates/YOUR_TEMPLATE/images folder.

[DogTags]

See if this works:

add this to your stylesheet_header_menu.css:

div#dropMenu li.submenu {background: url(../images/dropmenu.gif) 95% 50% no-repeat;}

The image is attached. It goes in your includes/templates/YOUR_TEMPLATE/images folder.

1. It was added to all top-level items (even those without sub items)

2. It was also added to sub items that had further sub items

[Rabbcon]

We got the old menus working for the Categories. Has anyone used CSS Flyout with sideboxes? Does this work?

[jettrue]

We got the old menus working for the Categories. Has anyone used CSS Flyout with sideboxes? Does this work?

The old contribution *can* work, its just really buggy. I had issue with categories that didn't have subcategories being first in the drop menu, etc.... certain category scenarios causes problems with the old mod. I have used the older sidebox one without issue on a site or two, I believe.

[Rabbcon]

...I have used the older sidebox one without issue on a site or two, I believe.

What do you mean by the "older sidebox one"? Do you mean that you have used the older contribution on a sidebox or there is a contribution for CSS Flyout Sideboxes that you have used? I did not see a contribution for CSS Flyout sideboxes in the download section. I may have overlooked it.

[jettrue]

What do you mean by the "older sidebox one"? Do you mean that you have used the older contribution on a sidebox or there is a contribution for CSS Flyout Sideboxes that you have used? I did not see a contribution for CSS Flyout sideboxes in the download section. I may have overlooked it.

It's in the downloads, under sideboxes.

Direct Link:

CSS Flyout Menu

[jettrue]

1. It was added to all top-level items (even those without sub items)

2. It was also added to sub items that had further sub items

1. Open up includes/templates/YOUR_TEMPLATE/common/tpl_drop_menu.php and remove the "class="submenu" from top-level items without sub items. So the contact us link would change to this:

<li><a href="<?php echo zen_href_link(FILENAME_CONTACT_US, '', 'NONSSL'); ?>"><?php echo HEADER_TITLE_CONTACT_US; ?></a></li>

2. Add this to the header_menu css file:
div#dropMenu li.submenu li.submenu {background: none;}

OR, you could use the image attached to have arrows pointing right to designate further subcategories, with this css:

div#dropMenu li.submenu li.submenu {background: url(../images/submenu.gif) 95% 50% no-repeat;}

[DogTags]

1. Open up includes/templates/YOUR_TEMPLATE/common/tpl_drop_menu.php and remove the "class="submenu" from top-level items without sub items. So the contact us link would change to this:

<li><a href="<?php echo zen_href_link(FILENAME_CONTACT_US, '', 'NONSSL'); ?>"><?php echo HEADER_TITLE_CONTACT_US; ?></a></li>

2. Add this to the header_menu css file:
div#dropMenu li.submenu li.submenu {background: none;}

OR, you could use the image attached to have arrows pointing right to designate further subcategories, with this css:

div#dropMenu li.submenu li.submenu {background: url(../images/submenu.gif) 95&#37; 50% no-repeat;}

Much better!

The only thing it doesn't seem to work with is the conditional menu items like the following:

      <li class="submenu"><a href="<?php echo zen_href_link(FILENAME_SHOPPING_CART, '', 'NONSSL'); ?>"><?php echo HEADER_TITLE_CART_CONTENTS; ?></a>
        <?php if ($_SESSION['cart']->count_contents() != 0) { ?>
        <ul class="level2">
          <li><a href="<?php echo zen_href_link(FILENAME_CHECKOUT_SHIPPING, '', 'SSL'); ?>"><?php echo HEADER_TITLE_CHECKOUT; ?></a></li>
        </ul>
        <?php }?>
      </li>

Even if there are no items in the cart, the down arrow still displays in the top Shopping Cart link.

Other than that, this menu is totally great

Thanks super much

[jettrue]

Much better!

Even if there are no items in the cart, the down arrow still displays in the top Shopping Cart link.

Will look into that more later. :-)