Customizing Viewpoint > Customizing navigation components > Creating links on the Viewpoint menu bar

3.2.1 Creating links on the Viewpoint menu bar

You can specify the links that appear in the navigation menu bar by using the <nav-menu> element. The <nav-menu> element has the same attributes and values as the <top-link> element (see Adding/editing top links) and also supports images the same way <top-link> does.

To create a drop-down link on the menu bar

  1. Open the core.xml file located in the Viewpoint home directory.
  2. Scroll to the <nav-menu> element.
  3. Insert the <menu> child element. Set the label attribute to the category name to appear in the navigation bar.
  4. For example, if you wanted to add a new drop-down menu option named "Reporting":

    <nav-menu>
      ...
        <menu label="Reporting"</menu>
    </nav-menu>
  5. If you want to display an icon with the label, use the <image> child element of <menu>. Specify the image path from the $CATALINA_HOME directory. For example:
  6. <nav-menu>
      ...
        <menu label="Reporting">
            <image>images/reporting_icon.png</image>
        </menu>
    </nav-menu>
  7. If you want to display only the image for the link, remove the label attribute of <menu>. For example:
  8. <nav-menu>
      ...
        <menu>
            <image>images/reporting_icon.png</image>
        </menu>
    </nav-menu>
  9. Configure the link(s) to reside within the category by inserting a <link> element inside of <menu>.
  10. For example, if you wanted a link named "Reports" to take users to the Viewpoint Reports page, do the following:

    <nav-menu>
      ...
        <menu label="Reporting">
            <link href="reporting" target="thisWindow" label="Reports">
            </link>
        </menu>
    </nav-menu>
  11. If you want to give the link an icon, insert an <image> element within <link>. Specify the image path from the $CATALINA_HOME directory. For example:
  12. <nav-menu>
      ...
        <menu label="Reporting">
            <link href="reporting" target="thisWindow" label="Reports">
                <image>images/reporting_icon.png</image>
            </link>
        </menu>
    </nav-menu>
  13. Restrict who may use the link by setting permissions (for more information, see Filtering navigation with permissions). For example:
  14. <nav-menu>
      ...
        <menu label="Reporting">
            <link href="reporting" target="thisWindow" label="Reports">
                <image>images/reporting_icon.png</image>
                <permission name="report.read" />
            </link>
        </menu>
    </nav-menu>

Related topics