Creating a custom page in navigation

Adding a custom page is a great way to enhance your site’s functionality by including pages like ‘Contact Us,’ ‘FAQ,’ or other static content. Follow the steps below to create a custom page and add it to the navigation menu in T-Doc Template.

Edit the navigation menu

Open the site.yaml file in your project directory.

The navigation section of this file manages the navigation menu displayed on your site.

Add a new entry under the navigation section for your custom page. Example:

navigation:
  - label: 'Docs'
    url: '/docs/'
  - label: 'About'
    url: '/about/'
  - label: 'Contact'
    url: '/contact/'
  - label: FAQ
    url: '/faq/'

Fields Explanation:

  • label: The text displayed in the navigation menu.
  • url: The relative URL of the custom page.

Create the Custom Page Directory

Navigate to the contents/ folder.
Create a new directory for your custom page. For example:

mkdir contents/faq

Add an index.md file

Inside the new directory (e.g., contents/faq), create a file named index.md.
This file contains the metadata and content for the custom page.

Add the following content to the index.md file:

---
title: "FAQ"
description: "Frequently asked questions"
views:
    html: pages.default_page
---

Fields Explanation:

  • title: The title of the custom page.
  • description: A short description or summary of the page’s content.
  • template: The Mustache template used to render the page.

Add Content to the Page

Below the metadata in index.md, write the content of your custom page using Markdown. Example:

## FAQ

### How do I reset my password?
If you forgot your password, you can reset it by clicking the "Forgot Password" link on the login page.

### How can I contact support?
You can reach our support team at [support@example.com](mailto:support@example.com).

Create a New Template (Optional)

If the default view pages.default_page does not fit your needs, create a custom Mustache file:
Navigate to templates/default/views/pages/.
Create a new Mustache file, e.g., faq.mustache.

Update the views.html field in the custom page’s metadata to use your new view:

views:
    html: pages.home

Regenerate the site automatically and refresh your browser
Ensure that the custom page is displayed correctly and can be accessed from the navigation menu.

Customize 404 page

  • To edit the 404 page, update the content in:
    📂 /contents/404/index.md
  • To customize the template itself, modify:
    📂 /templates/default/views/pages/404.mustache