Plone Drop Down Menu

qPloneDropDownMenu Product - allows managing multilevel drop-down menus in Plone.

Plone Drop Down Menu (qPloneDropDownMenu, Products.qPloneDropDownMenu) product allows managing multilevel drop-down menus in Plone.

Plone Drop Down Menu

Drop-down menu implemented by qPloneDropDownMenu Plone product is search engine friendly.

Usage

After product installation you will see Drop Down Menu item under Add-on Product Configuration in Site Setup. Here you can edit a list of items of your top level menu (global tabs).

To add submenu to the certain menu item, you need to add unordered list inside of top level menu item (<li>...</li>) after its title (<a></a>):

<ul><li>...</li>...<li>...</li></ul>

Sample menu with 2 submenus - in this example we added submenus to our Members and Events tabs:

<li id="portaltab-index_html" class="plain"><a href="http://example.com/" accesskey="t">Home</a></li>
<li id="portaltab-Members" class="plain"><a href="http://example.com/Members" accesskey="t">Members</a>
<ul>
<li><a href="http://example.com/Members/jdoe">John Doe</a></li>
<li><a href="http://example.com/Members/mmajor">Mary Major</a></li>
<li><a href="http://example.com/Members/olha">Olha Pelishok</a></li>
<li><a href="http://example.com/Members/james">Mark Rentan</a></li>
</ul>
</li>
<li id="portaltab-news" class="plain"><a href="http://example.com/news" accesskey="t">News</a></li>
<li id="portaltab-events" class="plain"><a href="http://example.com/events" accesskey="t">Events</a>
<ul>
<li><a href="http://example.com/events/previous">Past Events</a></li>
<li><a href="http://example.com/calendar">Calendar</a></li>
</ul>
</li>

You can click regenerate menu button on drop down menu configlet form to reset menu. This can be useful in case html of menu code is broken. Generated code is based on status of Automatically generate tabs in your Navigation settings (so, if you want to regenerate menu you should pay attention to status of Automatically generate tabs in your Navigation settings). However, you will loose your previous code of menu with all submenus after you click regenerate menu.

Note: For Plone below 2.1 to use drop_down.css add <dtml-var drop_down.css> line to your portal ploneCustom.css.

Supported Plone versions

  • Plone 2.x, 3.x - - use qPloneDropDownMenu 0.2.1 release
  • Plone 4.0 - use Products.qPloneDropDownMenu 3.0 release

Authors

  • Myroslav Opyr
  • Vitaliy Podoba
  • Taras Melnychuk

Links

Connect with our experts Let's talk