Building Content Management Systems
& e-Business Solutions

Code Snippets: Navigation Block 

This module allows the owner of the website to build and manage a block of links as part of their websites overall navigation scheme.  Each navigation block (minimum 1, maximum unlimited) will contribute to the websites navigation.  For more information please see the tutorial on dynamic navigation.


  • Add, remove, rename links.
  • Links can lead to new pages, existing pages, external URLs, or uploaded files

User Documentation

Deemed unnecessary.


Applicable Styling Code

The styling code can be placed within the head of your html between two sytle tags or appear in an attached style sheet.

#navbar1 a{
display: inline; /* "inline" for horizontal navigation, "block" for vertical navigation*/
color: #6666FF;
background-color: #FFFFFF;
border: 1px solid #C1C1C1;
 #navbar1 a:hover{
color: #9B9B9B;
background-color: #DAE0D2;
border: 1px solid #C1C1C1;

Clear Site Tag Code

  • Place this code where you want the navigation block to appear.
  • The "name" attribute in the clearsite tag must match the "id" attribute of the div tag.
  • If you have multiple navigation blocks within your page design, make sure you are familiar with our tutorial on dynamic navigation.
<clearsite module="navbar" name="navbar1" depth="deep" sitewide="1" >
  <div id="navbar1"><a href="#">Folder I</a> <a href="#">Folder II</a></div>

    Copyright Clear Site Web Solutions Corporation  |  Victoria, B.C. Canada