mirror of
https://github.com/mintlify/docs.git
synced 2026-09-14 13:35:46 +08:00
78a2bb1197
* Update editor/pages.mdx Co-Authored-By: mintlify[bot] <109931778+mintlify[bot]@users.noreply.github.com> * Update editor/pages.mdx Co-Authored-By: mintlify[bot] <109931778+mintlify[bot]@users.noreply.github.com> * Update editor/pages.mdx Co-Authored-By: mintlify[bot] <109931778+mintlify[bot]@users.noreply.github.com> * Update editor/pages.mdx Co-Authored-By: mintlify[bot] <109931778+mintlify[bot]@users.noreply.github.com> * Update editor/navigation.mdx Co-Authored-By: mintlify[bot] <109931778+mintlify[bot]@users.noreply.github.com> * Update editor/navigation.mdx Co-Authored-By: mintlify[bot] <109931778+mintlify[bot]@users.noreply.github.com> * Update editor/navigation.mdx Co-Authored-By: mintlify[bot] <109931778+mintlify[bot]@users.noreply.github.com> * Apply suggestion from @tembo[bot] Co-authored-by: tembo[bot] <208362400+tembo[bot]@users.noreply.github.com> * Apply suggestion from @tembo[bot] Co-authored-by: tembo[bot] <208362400+tembo[bot]@users.noreply.github.com> * Apply suggestions from code review Co-authored-by: tembo[bot] <208362400+tembo[bot]@users.noreply.github.com> * add image for existing file menu * move content to pages * copyedit * fix image path * vale * Update editor/pages.mdx Co-authored-by: tembo[bot] <208362400+tembo[bot]@users.noreply.github.com> * Update editor/navigation.mdx Co-authored-by: tembo[bot] <208362400+tembo[bot]@users.noreply.github.com> * 💅 --------- Co-authored-by: mintlify[bot] <109931778+mintlify[bot]@users.noreply.github.com> Co-authored-by: Ethan Palm <56270045+ethanpalm@users.noreply.github.com> Co-authored-by: tembo[bot] <208362400+tembo[bot]@users.noreply.github.com>
111 lines
4.7 KiB
Plaintext
111 lines
4.7 KiB
Plaintext
---
|
|
title: "Create and edit pages"
|
|
description: "Create, edit, and organize documentation pages in the web editor."
|
|
keywords: ["editor", "content", "pages", "files"]
|
|
---
|
|
|
|
## Navigate files
|
|
|
|
Browse your documentation pages in the **Navigation** tab of the left panel.
|
|
|
|
- Click navigation elements to expand or collapse them.
|
|
- Click pages to open them in the editor.
|
|
- Click the search icon or press <kbd>Cmd</kbd> + <kbd>P</kbd> (macOS) or <kbd>Ctrl</kbd> + <kbd>P</kbd> (Windows) to search for files by name.
|
|
|
|
### View unused pages
|
|
|
|
The **Unused pages** section at the bottom of the **Settings** section of the sidebar shows pages and other files that exist in your repository, but aren't included in your navigation. These are [hidden](/organize/hidden-pages) pages that don't appear on your published site until you add them to navigation.
|
|
|
|
## Create new pages
|
|
|
|
1. Click the **+** button in the navigation element where you want to add a page.
|
|
1. Click **Add a page**.
|
|
1. Enter a filename. The editor adds the `.mdx` extension automatically.
|
|
|
|
## Add unused pages to navigation
|
|
|
|
Add pages from the **Unused pages** section to your navigation.
|
|
|
|
**Drag and drop:**
|
|
|
|
1. Find the page in the **Unused pages** section.
|
|
1. Drag the page to the desired location in your navigation tree.
|
|
|
|
**In the navigation tree:**
|
|
|
|
1. Click the plus button, <Icon icon="plus" />, where you want to add the file.
|
|
1. Click **Add existing file**.
|
|
1. Select the page you want to add.
|
|
|
|
## Edit content
|
|
|
|
Switch between visual and Markdown mode with the toggle in the toolbar. The web editor saves your changes when switching modes.
|
|
|
|
<Frame>
|
|
<img src="/images/editor/mode-toggle-light.png" alt="Mode toggle in the toolbar." className="block dark:hidden" />
|
|
<img src="/images/editor/mode-toggle-dark.png" alt="Mode toggle in the toolbar." className="hidden dark:block" />
|
|
</Frame>
|
|
|
|
### Visual mode
|
|
|
|
Edit content with real-time previews that show how the content looks when published.
|
|
|
|
- **Add text**: Type in the editor to see how the text appears when published.
|
|
- **Format text**: Use the toolbar to bold, italicize, or apply other formatting to text.
|
|
- **Add components**: Press <kbd>/</kbd> to open the component menu and select components.
|
|
- **Add images**: Use the image component from the <kbd>/</kbd> menu.
|
|
- **Insert links**: Select text and press <kbd>Cmd</kbd> + <kbd>K</kbd>.
|
|
|
|
See [Components](/components) for the complete list of available components.
|
|
|
|
### Markdown mode
|
|
|
|
Edit the MDX source code.
|
|
|
|
- **Direct MDX editing**: Write MDX and Markdown syntax for precise control over content.
|
|
- **Component properties**: Set component properties and configurations.
|
|
- **Frontmatter**: Edit page metadata at the top of the file.
|
|
|
|
See [Format text](/create/text) and [Format code](/create/code) for more information on MDX syntax.
|
|
|
|
## Configure pages
|
|
|
|
Configure page settings to control how pages appear in navigation, search results, and your site layout.
|
|
|
|
1. Right-click a file.
|
|
2. Click **Configure**.
|
|
|
|
### Customize navigation appearance
|
|
|
|
Control how the page appears in your site's navigation sidebar.
|
|
|
|
- **Title**: Set the main heading. Appears in navigation, browser tabs, and search results.
|
|
- **Sidebar title**: Display shorter text in navigation when the full title is too long for the sidebar.
|
|
- **Icon**: Add a visual marker next to the page to help users identify it quickly.
|
|
- **External URL**: Link to an external site instead of a page. Use this to add external resources to your navigation.
|
|
|
|
### Optimize for search and sharing
|
|
|
|
Help users find your page and improve how it appears when shared.
|
|
|
|
- **Description**: Write a brief summary. Appears in search results and SEO meta tags.
|
|
- **Keywords**: Add relevant search terms to help users discover this page.
|
|
- **OG Image URL**: Set a custom preview image for social media shares and link previews.
|
|
|
|
### Control page layout
|
|
|
|
Choose how the page displays to match your content needs.
|
|
|
|
- **Standard layout** (`default`): Default page with sidebar navigation and table of contents.
|
|
- **Full-width layout** (`wide`): Hides table of contents to allow wider layouts for tables, diagrams, or other content.
|
|
- **Centered layout** (`center`): Hides sidebar and table of contents for better readability of text-heavy pages like changelogs.
|
|
- **Custom width** (`custom`): Minimal layout with only the top navbar for landing pages or other unique layouts.
|
|
|
|
## Move pages
|
|
|
|
To move pages in your navigation, drag and drop them to your desired location.
|
|
|
|
To duplicate or delete pages, right-click the page and select the desired action.
|
|
|
|
To remove a page from navigation without deleting the file, right-click the page and click **Hide Page**. The page moves to the **Unused pages** section and won't appear on your published site. The file remains in your repository and you can add it back to navigation later.
|