GenericNav as sitemap

Overview

The GenericNav tag is used to generate a best practice, standards based navigation using nested lists. This is ideal for styling with CSS and is by far the most accessible approach to building navigation elements. Generic Nav can also be used to dynamically build sitemaps for your website.

Here's How

If you are curious how it is setup see:

• genericNav tag: \farcry\core\tags\webskin\genericNav.cfm

When you study the parameters and comments made inside this or any other tag, you get a good idea of what is possible with it.

If your project is setup with the default skeleton Mollio the genericNav CSS is located at:

genericNav CSS: \project\www\css\main.css (search for #nav)

Other then regular navigation you also can use it to create a sitemap.

<!--- sitemap navigation --->

<skin:genericNav navID="#application.navid.home#"
                        depth="2"
                        id="sitemap"
                        bActive="true"
                        bIncludeHome="true">

In this example depth="2" is used, which means that the hierarchy or level of expansion will go to level 2, adjust when needed.

Here the id is set to sitemap (instead of the Mollio default id="nav"), that points to the following CSS:

/* ============================= sitemap ====================== */

#sitemap li.active { font-weight:bold; decoration:none}

#sitemap li.active li {font-weight:bold}

Of course you can do whatever you want with the CSS, this is just an example.

Like in the default Mollio setup bActive and bIncludeHome are set to ="true", as also in the sitemap it's a good idea to show visitors where they are (bActive) and therefore also include the home item (bIncludeHome).

So it is as simple as grabbing the genericNav code and assign a different CSS id that points to some rules you want to apply.

Although a good insight to how it works, there is already a existing sitemap tag which you can find through:

\farcry\core\tags\webskin\sitemap.cfm

Include it by:

<!--- sitemap navigation --->
<skin:sitemap>

Of course don't forget to include the webskin tag library by:

<cfimport taglib="/farcry/core/tags/webskin" prefix="skin" />