How To... Implement Page Highlighting

Pepperio has made it really easy to apply page highlighting.

If you have a list of links and one of those links refers to the current page being viewed not only can it be styled differently, but as it is a different snippet, the form the snippet takes can also be completely different from the others. Currentitemtemplate is the attribute used to achieve this.

Note that in the editor the currentitemtemplate is ALWAYS rendered to the second item in the list. Preview the page to see it working.

1. Build a list

Build a regular list, and include the currentitemtemplate attribute...

1. %LIST(

2. type=ul,

3. src=_parent,

4. allow=subpage,

5. itemtemplate=nav_listitem,

6. currentitemtemplate=here_listitem)%

2. Define the 'currentitemtemplate' Snippet

As it is considered bad form to link to the page your own, this template will just display the label, rather than a full link like the itemtemplate snippet would most probably do.

1. <li>%TITLE%</li>

as opposed to the itemtemplate

1. <li><a href="%LINK%">%TITLE%</a></li>

HTML Output (if we are on 'page_3.html)

1. <ul>

2. <li><a href="page_1.html">Page 1</a></li>

3. <li><a href="page_2.html">Page 2</a></li>

4. <li>Page 3</li>

5. <li><a href="page_4.html">Page 4</a></li>

6. <li><a href="page_5.html">Page 5</a></li>

7. </ul>