posted time Created time: 2015-07-10 posted time Last updated time:

Tags Side Navigation Component

The Tags Side Navi Component makes tree structured navigation widget on the tag pages. This component is available on the tag pages, which represents the keyword tag.

Appearance and usage of the Tags Side Navigation Component

The Tags Side Navigation page is used on the template of Keyword Tag Page. This component show the hierarchy of the keyword tags like below.

Tags navigation component

This component shows the structure of the keyword tags. When user going to search contents with the tag, this function is useful.

Source code of the Tags Side Navigation Component

The Tags Side Navigation Component consists of Html code, server side program, and Style Sheet.

Html code

The Html code of the Tags Side Navigation Component is below.

This code is to embed the "$tag" variable. This variable is row Html code, and it is created in the server side program.

Server side program

The server side program of the Tags Side Navigation Component is below.

The goal of this program is to create the "$tag" variable. This variable is string formatted in Html.

This program make the Html code in following operations.

Get database record of the current page

Get the record of current page's keyword tag by the "getCurretnTags()" function.

The function queries the database table whose name is "cms_tag". This table has information about the keyword tags.

Get Html code of the Keyword Tags with tree structure

The "renderTagLi()" function creates the Html formatted string to show the keyword tag structure in the list tag of the Html.

This function queries the 2nd level tags, and add child tags to each records by calling the "renderChildren()" function.

Style Sheet

The Style Sheet of the Tags Side Navigation Component is below.

Image Resource

The image resource is on the pane of Resources tab. The icon of the tag is there.

Image resource

When you change the design, upload your own tag, and change the Html code.


Go to Top