In CleanSlate, there are currently five different ways to create navigation.
r:site_menu: This tag outputs your navigation starting from your site's root. There are several attributes you can add to this tag. View its documentation in the tag index.
r:sub_menu: The sub menu tag lists the child pages that are direct descendants of the current page as an unordered list. It also accepts a number of attributes. View its documentation in the tag index.
r:ancestor_menu: This will list all pages going up from the current page and pages at the root. So, if you put this tag in a page nested deep within your site, it will print out all pages above and below the current page. It will not print out pages nested beneath other root level pages. The menu to the right is an example of the ancestor menu. Again, read up on the documentation for this tag on its page in the tag index.
- Use labels on pages to make a custom navigation. Log in to CleanSlate, go to your site > Pages. Select the pages you want to include in the navigation and add a label to them. Then, in your template, follow these instructions to generate a navigation based on those labels.
Make it manually with
data-page-idattributes: You can always create an unordered list manually. As an added bonus, you can use a
data-page-idattribute to dynamically generate the URL in the
hreffield. This makes sure that, if the permalink or page name changes, the link does not break. A page always has one ID and it never changes. The DIY Outdoors site uses this for their activity navigation. View the activity navigation code.
<a href="path/to/my/page" data-page-id="1234">Example Link</a>
How do I find a page's ID? Log in to CleanSlate and edit the page
you want to link to. In your browser's URL bar, you'll see:
https://cleanslate.wvu.edu/sites/13/pages/3618/editor. In this case,
3618is that page's ID.
- As an added bonus, you'll notice when you make a link to a page inside your
site in the editor, the system will add a
data-page-idattribute to each link.
Last updated on February 10, 2020.
We welcome all questions, feedback and bug reports. If you're having an issue, we usually need the following information:
- A brief description of the issue
- A link to the page where you saw the issue
- Screenshots that illustrate the problem - How do I take a screenshot?