Side Navi part

The Primitive Template of the side navi. The side navi shows the document tree structure of the pages.


In order to preview the side navi part, open it with Primitive Template editor page, and select the page to preview in the parameter setting dialog.

The appearance of the side navi part is below.

side navi template part

The side navi part is used in following template containers and Top Templates.

Design Setting

The design of side navi Part consists of Html and Style Sheet.


The html code of side navi is below.

This Html code supports until 3rd level nodes. If your website has deeper hierarchy than this, you can add the fourth depth nodes list in this html. The variable of the node is automatically made by the server side program.

Style Sheet

The style sheet for the html above is below.

Server side program

The program to get the tree structure of the side navi is below.

This program makes variable of the url list. The navigation list have to be simple, because if the part is too heavy, it is not good in SEO.

The program makes list of pages of parents, ancestor, and children of the node when current node is the node of the document tree. When it is leaf, it makes ones of parents, ancestor, and sibling nodes.

Go to Top