Skip to main content

​
Basics

Each page is an MDX file that should begin with --- at the start and end. This is used to define the page’s metadata, such as the title and description. For example, you can define the title for this page as follows. 
---
title: "Your title goes here"
---

​
Descriptions

You can add a description that shows the summary of the page under the title with the description metadata. 
---
description: "Your description goes here"
---
If you want to show a different title in the navigation, you can set the sidebarTitle metadata. This is useful if your title is long and you want something shorter in the navigation links. 
---
title: "Your very long page title you want to shorten"
sidebarTitle: "Short title"
---

​
Icons

You can set an icon for your sidebar item like the one for this page. You can set icons by using the icon metadata. 
---
title: "Code Block"
icon: "code"
---
You can set icons from Font Awesome and Lucide, depending on the icon library setting. You can also set the icon type for Font Awesome icons (optional). If not set, the icon type will be regular. 
---
iconType: "solid"
---

​
API Pages

API pages let you build interactive API playgrounds. To create an API page, you must set an api or openapi property in the page metadata. Learn more about API pages by visiting the API page guides. 
---
openapi: "GET /endpoint"
---

​
Page Mode

The Page Mode setting allows you to customize the appearance of your page. You can choose from different modes to adjust the layout according to your needs. If no mode is specified, the page will use the default settings.

​
Default

If no specific mode is given, the page will default to standard settings. This means the page will display the default table of contents and other standard elements. 
---
title: "Default page title"
---

​
Wide Mode

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 more content. 
---
mode: "wide"
---

​
Custom Mode

Custom Mode provides a minimalist layout by removing all elements except for the top bar. This mode offers a blank canvas, which is ideal for creating a “landing page” or any page where you want a clean, distraction-free environment. 
---
mode: "custom"
---

​
Center Mode

Center Mode removes the sidebar and the table of contents, and centers the page content. This mode is great for changelogs or any page where you want to focus on the content. 
---
mode: "center"
---
If you want the sidebar to open an external URL, you can set the url metadata in any page. 
---
title: "Page that goes to external link"
url: "https://www.npmjs.com/package/mint"
---

​
Search Engine Optimization

You can set meta tags like the image set when shared on social media by passing them into your page’s metadata. Note that meta tags with colons need to be wrapped in quotes. 
---
"twitter:image": "/images/your-photo.jpg"
---
See SEO to learn more about SEO metadata.

​
Internal Search Optimization

You can also enhance a specific page’s discoverability in the built-in search by providing keywords in your metadata. These keywords won’t appear as part of the page content or in search results, but users that search for them will be shown the page as a result. 
---
keywords: ['search', 'indexing']
---
⌘I