The main menu – Table of Contents (TOC)

The term TOC is commonly used in the CMSimple_XH community for the main navigation menu of a website. If you are using a pre-built template, such a menu should already be functionally included. If you want to change the navigation of an existing template or create your own, then read on.

Basic variants

Simple toc()

The easiest way to create the main menu is to call toc() in the template:

<?php echo toc();?>

This will show a closed menu at the appropriate location, with only the currently selected branch expanded.

Limited toc()

You can add two additional parameters to the call toc(): the start and end levels for the menu. This way you can restrict the menu levels to be displayed in the menu. A common use case is to display only first level links in a horizontal menu:

<?php echo toc(1, 1);?>

In addition to that, you could display a (vertical) submenu for the subpages of the current page in another place in the template:

<?php echo toc(2, 3);?>

There’s plenty of room for your creativity here.

Advanced toc()

The code that creates the main menu is divided into two parts: The function li() outputs the actual HTML, and the function toc() creates the list of pages to display and calls li() with this list. It is possible to write your own function to be used instead of li(). You just have to add it as a third parameter to toc() (in the example, my_li):

<?php echo toc(null, null, 'my_li');?>

You can pretty much go wild writing your own li(), but a common use case is to just make a small change to the existing li(). To make future updates/upgrades easier, make a copy of li(), save it in userfuncs.php, rename it, and change it. Then change your template to call its own li(). This way it won’t be overwritten by future updates.

li()

Using toc() outputs only the HTML of the pages that are visible in the partially expanded tree view of the TOC. This is not appropriate for dropdown menus, where all pages must be written to the HTML. To accommodate this, you can use the following code:

<?php echo li($hc, 'menulevel');?>

Of course, you can also use this for static menus (as opposed to dropdown menus).

The appearance of the main menu

toc() or li() output the main menu as unordered lists <ul>, where each menu item is a list item <li>. The labels are rendered as link <a>, except for the currently selected page, whose label is rendered as <span>. This structure is quite common for menus and can be easily customized with CSS (there are many tutorials that help, even if they are not particularly related to CMSimple_XH).

Besides this structure, CMSimple_XH sets a class for each menu item <li>: .doc, .docs, .sdoc or .sdocs.

.doc or .sdoc are set for pages without subpages; other menu items get .docs or .sdocs. You can use these classes to indicate to visitors where to look for subpages.

.sdoc or .sdocs identify the currently selected page and its parent pages (see Configuration); other menu items are given the class .doc or .docs. This is useful for highlighting the page(s) under consideration in the TOC.

Configuration

Under Admin menu → Settings → Configuration there are several options that refer to the main menu (TOC).

Menu: Sdoc can be set to parent or left empty. In the latter case, only the page currently being displayed is marked in the menu (gets the .sdoc or .sdocs class); in the former case, the entire path of pages up to the selected page is marked in this way, which is especially useful for dropdown menus.

Show hidden pages : can be enabled (checked) in the menu. Only in this case, hidden pages will be displayed in the menu when they have been called.