Navigation Demo

Use Case: A list of pages, e.g. different products, should be displayed in the navigation under "Products". When user clicks on "Products" the first product is directly displayed and marked as selected in the navigation. There is no product overview page.

 

Since OpenCms 8.5.0 there is a new function page "Navigation Level" to define a navigation entry point, which automatically links to the first sub page. Use this function page, if you would like to list several pages in the navigation without an overview page.

 

How to use the "Navigation Level"

Following steps are required:

  • Open the sitemap editor.
  • Open tab "Function pages" in the "Add" dialog and drop the "Navigation Level" into the sitemap.
  • Add per drag & drop several sub pages under the new navigation entry.

Implementation details

You can use the new method "navigationLevel" of the CmsJspNavElement to recognize the "Navigation Level" element in the navigation. This can be usefull e.g. for styling.

Navigation example snippet with <cms:navigation> tag:

<cms:navigation type="treeForFolder" startLevel="1" endLevel="4" var="nav"/>
<c:forEach items="${nav.items}" var="elem">
    ...
   <a href="<cms:link>${elem.resourceName}</cms:link>" <c:if test="${nav.isActive[elem.resourceName] and !elem.navigationLevel }">class="current"</c:if>${elem.navText}</a>           
    ...
</c:forEach>
        

Please check following jsp for the complete navigation example:

/system/modules/org.opencms.dev.demo/elements/site-elements/side_nav.jsp