Skip to end of metadata
Go to start of metadata

I thought it could not be done, but it can. Special thanks to Craig George for the solution.
This is how you get a nested unordered, bulleted list for a navigation menu in IBM WCM (Lotus Web Content Management).

Set up you site and site areas:

Site-Name

  • Home
  • Page 2 <selected>
    • Page 2a
    • Page 2b
    • Page 2c
  • Page 3
  • Page 4

And you want this: Perfect html for a suckerfish style css only menu:

You need 3 components, 1 Html Component and 2 navigators

HTML Component: HMTL-classcurrent

Description: This is just a single word returned to change the css class when the item is selected.

Body:

Navigator: NAV--TopNavigation

Description: Creates a bulleted list with 1 level of nesting for the selected item.

Start Type: Selected
Selected Start Area: [select your site start area]
Descendant Level: 1 Level

(Leave other settings as default)

Header:

Footer:

Separator:

Navigator result design 1:

Navigator: NAV--SubNavigation

Description: This is called only for the selected item in the top navigation.

Start Type: Current Site Area
Selected Start Area: None
Include Start: true
Ancestor Level: 1 Level
Descendant Level: None
Preceding Siblings Level: All
Next Siblings Level: All
Show Site: false
Show Content: false
Expand current navigator branch one level: true
Expand navigator to display current site area: true

*Header:*

*Footer:*

Separator:

Navigator result design 1

Navigator result design 2

Labels:
None
Enter labels to add to this page:
Please wait 
Looking for a label? Just start typing.

4 Comments

comments.show.hide

  1. Dec 13, 2010

    Anonymous

    Can we make it pick up nodes from sidemap recursively instead of defining two level navigators? Suppose we have 3 or 4 level's of site area hierarchies, we need to add 3 or 4 navigators using this method

  2. Dec 14, 2010

    Anonymous

    It renders the following list instead of the list documented in the article:

    <ul>
    <li><a href="url">Home</a></li>
    <li class="current"><a href="url">Page 2
    <ul>
    <li class="current"><a href="url">Page 2a</a></li>
    <li><a href="url">Page 2b</a></li>
    <li><a href="url">Page 2c</a></li>
    </ul></li>
    <li><a href="url">Page 3</a></li>
    <li><a href="url">Page 4</a></li>
    </ul>

    The hierarchy of the sibling nodes are lost

    1. Dec 20, 2010

      Ben Shoemate

      You're html looks valid, which is the goal. remember, only the active page will have its children shown.

      For example - a folder structure like:

      • 1
        • 1a
        • 1b
      • 2
        • 2a
        • 2b
      • 3
        • 3a
        • 3b

      If 3 is selected, then 1a, 1b, and 2a, 2b are not shown."
      I used this approach is used here - http://my.austinenergy.com/wps/portal/rr

  3. Mar 06, 2012

    Ben Shoemate

    Arrg - I forgot this approach does not work when you need all levels expanded. We have an xWidget approach that works for that though.