Pages Quickstart

Each page is a md/mdx file that should follow frontmatter specification:

---
title: My title
---

inside you docs project like follow:

.
├ folder-name
│  └─ your-page-within-folder.md
|
├─ your-page.md
|
└─ docs.json

Title

The title field is used for the page title (SEO) and for the sidebar navigation item:

---
title: Writing quickstart
---

you can also set different title for sidebar:

---
title: Writing quickstart # for SEO
sidebarTitlte:  Quickstart # visible in sidebar
---

Description

The description field is used for SEO purposes and will be displayed in search engine results. It should be a concise summary of the page content.

---
title: My title
description: A brief summary of what this page is about
---

Sidebar Title

You can set also different sidebar title.

---
title: My SEO title
sidebarTitle: My sidebar title
---

Sidebar Icons

You can customize the sidebar icons for each page by specifying an icon name. The icon will be displayed next to the page title in the navigation.

---
title: My title
icon: book
---

Page Layout

The Page Layout setting allows you to customize the appearance of your page through different layout modes. This setting is optional - if not specified, the page will use the default layout settings.

Default

If no specific mode is given, the page will default to standard settings. This means the page will display with the default table of contents (if headings are present) and other standard elements, providing a typical layout without any special adjustments.

---
title: My title
---

Wide

In Wide Mode, you can hide the table of contents (ToC) on the right side of the page. This is particularly useful if your page doesn't have any headings or if you prefer to utilize the extra horizontal space for other content.

---
title: My title
layout: wide
---

Page

In Page mode only the header is showing up, the entire content area is removed from all styles it means you need to set all margins and paddings from scratch. It was designed to have a custom page possibilities leaving that is shared across all pages (header).

---
title: My title
layout: page
---

Reader

In Reader mode sidebar and ToC are hidden. All page margins and paddings are applied in the opposite of Page mode. Use reader mode in blogs or other content focused pages.

---
title: My title
layout: reader
---

CustomComing Soon

Custom layout mode allows you to define your own page layout by specifying a custom component from scratch. This gives you full control over the page structure and styling, enabling you to create unique layouts for specific pages.

---
title: My title
layout: custom
---

TOC

The Table of Contents (TOC) is automatically generated based on the headings in your page. It provides easy navigation through your content and can be customized in several ways.

Depth

You can customize the depth level of TOCs per page:

---
maxTocDepth: 2
---

Card

tocCard meta is useful for showing additional card below table of contents with addional info to your content.

---
tocCard: 
    link: https://github.com/xyd-js/customization-samples
    title: Customization Samples
    description: Learn how to setup customize your docs
    icon: github
---

UniformExperimental

uniform meta allows to load uniform function for entire page, learn more here.

---
title: Callouts
icon: info
layout: wide
uniform: "@components/writer/Callout/Callout.tsx"
---