You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
Edit directly in your browser with a visual interface
74
55
</Card>
56
+
</CardGroup>
75
57
76
-
## Code-based workflow
77
-
78
-
The code-based workflow integrates with your existing development environment and Git repositories. This workflow is best for technical teams who want to manage documentation alongside code.
58
+
## Code-based editing
79
59
80
60
### Install the CLI
81
61
82
-
To work locally with your documentation, install the Command Line Interface (CLI), called [mint](https://www.npmjs.com/package/mint), by running this command in your terminal:
62
+
Install the Mintlify CLI to work locally:
83
63
84
64
<CodeGroup>
85
-
```bash npm
86
-
npm i -g mint
87
-
```
65
+
```bash npm
66
+
npm i -g mint
67
+
```
88
68
89
-
```bash pnpm
90
-
pnpm add -g mint
91
-
```
69
+
```bash pnpm
70
+
pnpm add -g mint
71
+
```
92
72
</CodeGroup>
93
73
94
74
<Info>
95
-
You need Node.js installed on your machine. If you encounter installation issues, check the troubleshooting guide.
75
+
Requires Node.js v19+. Having issues? Check the troubleshooting section below.
96
76
</Info>
97
77
98
-
### Edit the documentation
99
-
100
-
After setting up your environment, you can start editing your documentation files. For example, update the title of the introduction page:
101
-
102
-
1. Open your repository created during onboarding.
103
-
2. Open `index.mdx` and locate the top of the file:
104
-
105
-
```mdx index.mdx
106
-
---
107
-
title: "Introduction"
108
-
description: "This is the introduction to the documentation"
109
-
---
110
-
```
78
+
### Make your first edit
111
79
112
-
3. Update the `title` field to `"Hello World"`.
80
+
1. Open your repository from onboarding
81
+
2. Edit `index.mdx` and change the title:
113
82
114
83
```mdx index.mdx {2}
115
84
---
@@ -118,133 +87,113 @@ description: "This is the introduction to the documentation"
118
87
---
119
88
```
120
89
121
-
### Preview the changes
90
+
### Preview locally
122
91
123
-
To preview the changes locally, run the following command:
92
+
Run the development server:
124
93
125
94
```bash
126
95
mint dev
127
96
```
128
97
129
-
Your preview will be available at `localhost:3000`.
When you are ready to publish your changes, push them to your repository.
107
+
Push your changes to GitHub. Mintlify automatically builds and deploys your updates.
139
108
140
-
Mintlify automatically detects the changes, builds your documentation, and deploys the updates to your site. Monitor the deployment status in your GitHub repository commit history or the[dashboard](https://dashboard.mintlify.com).
109
+
Monitor deployment status in your GitHub commit history or [dashboard](https://dashboard.mintlify.com).
141
110
142
-
After the deployment completes, your latest update will be available at `<your-project-name>.mintlify.app`.
111
+
## Web editor
143
112
144
-
<Cardtitle="Jump to adding a custom domain"icon="arrow-down"href="#adding-a-custom-domain"horizontal>
145
-
Optionally, skip the web editor workflow and jump to adding a custom domain.
146
-
</Card>
147
-
148
-
## Web editor workflow
149
-
150
-
The web editor workflow provides a what-you-see-is-what-you-get (WYSIWYG) interface for creating and editing documentation. This workflow is best for people who want to work in their web browser without additional local development tools.
113
+
### Access the editor
151
114
152
-
### Access the web editor
153
-
154
-
1. Log in to your [dashboard](https://dashboard.mintlify.com).
155
-
2. Select **Editor** on the left sidebar.
156
-
157
-
<Info>
158
-
If you have not installed the GitHub App, you will be prompted to install the app when you open the web editor.
159
-
</Info>
115
+
1. Go to your [dashboard](https://dashboard.mintlify.com)
116
+
2. Click **Editor** in the sidebar
160
117
161
118
<Frame>
162
-
<imgalt="The Mintlify web editor in the visual editor mode"src="/images/quickstart/web-editor-light.png"className="block dark:hidden" />
163
-
<imgalt="The Mintlify web editor in the visual editor mode"src="/images/quickstart/web-editor-dark.png"className="hidden dark:block" />
119
+
<imgalt="The Mintlify web editor"src="/images/quickstart/web-editor-light.png"className="block dark:hidden" />
120
+
<imgalt="The Mintlify web editor"src="/images/quickstart/web-editor-dark.png"className="hidden dark:block" />
164
121
</Frame>
165
122
166
-
### Edit the documentation
167
-
168
-
In the web editor, you can navigate through your documentation files in the sidebar. Let's update the introduction page:
169
-
170
-
Find and select `index.mdx` in the file explorer.
123
+
### Make your first edit
171
124
172
-
Then, in the editor, update the title field to "Hello World".
125
+
1. Select `index.mdx` in the file explorer
126
+
2. Change the title to "Hello World"
173
127
174
128
<Frame>
175
129
<imgalt="Editing in Web Editor"src="/images/quickstart/web-editor-editing-light.png"className="block dark:hidden" />
176
130
<imgalt="Editing in Web Editor"src="/images/quickstart/web-editor-editing-dark.png"className="hidden dark:block" />
177
131
</Frame>
178
132
179
133
<Tip>
180
-
The editor provides a rich set of formatting tools and components. Type <kbd>/</kbd> in the editor to open the command menu and access these tools.
134
+
Type <kbd>/</kbd> to open the command menu and access formatting tools and components.
181
135
</Tip>
182
136
183
-
### Publish your changes
137
+
### Publish changes
184
138
185
-
When you're satisfied with your edits, select the **Publish**button in the top-right corner. Your changes are immediately deployed to your documentation site.
139
+
Click **Publish** in the top-right corner. Your changes deploy immediately.
186
140
187
141
<Tip>
188
-
Use branches to preview and review changes through pull requests before deploying to your live site.
142
+
Use branches to preview changes through pull requests before going live.
189
143
</Tip>
190
144
191
-
For more details about using the web editor, including using branches and pull requests to collaborate and preview changes, see our [web editor documentation](/editor).
145
+
## Add a custom domain
192
146
193
-
## Adding a custom domain
147
+
Replace your `.mintlify.app` subdomain with your own domain:
194
148
195
-
While your `<your-project-name>.mintlify.app` subdomain works well for testing and development, most teams prefer using a custom domain for production documentation.
149
+
1. Go to [Domain Setup](https://dashboard.mintlify.com/settings/deployment/custom-domain) in your dashboard
150
+
2. Enter your domain (e.g., `docs.yourcompany.com`)
151
+
3. Add this DNS record with your domain provider:
196
152
197
-
To add a custom domain, navigate to the [Domain Setup](https://dashboard.mintlify.com/settings/deployment/custom-domain) page in your dashboard.
If you encounter issues during the setup process, check these common troubleshooting solutions:
239
-
240
189
<AccordionGroup>
241
-
<Accordiontitle="Local preview not working">
242
-
Make sure you have Node.js v19+ installed and that you run the `mint dev` command from the directory containing your `docs.json` file.
243
-
</Accordion>
244
-
<Accordiontitle="Changes not reflecting on live site">
245
-
Deployment can take upwards to a few minutes. Check your GitHub Actions (for code-based workflow) or deployment logs in the Mintlify dashboard to ensure there are no build errors.
246
-
</Accordion>
247
-
<Accordiontitle="Custom domain not connecting">
248
-
Verify that your DNS records are set up correctly and allow sufficient time for DNS propagation (up to 48 hours). You can use tools like[DNSChecker](https://dnschecker.org) to verify your CNAME record.
249
-
</Accordion>
250
-
</AccordionGroup>
190
+
<Accordiontitle="Local preview not working">
191
+
Ensure you have Node.js v19+ installed and run `mint dev` from the directory containing your `docs.json` file.
192
+
</Accordion>
193
+
<Accordiontitle="Changes not appearing on live site">
194
+
Deployment takes a few minutes. Check GitHub Actions or dashboard deployment logs for build errors.
195
+
</Accordion>
196
+
<Accordiontitle="Custom domain not connecting">
197
+
Verify DNS records are correct and allow time for propagation. Use[DNSChecker](https://dnschecker.org) to verify your CNAME record.
![mintlify-development[bot]](https://avatars.githubusercontent.com/in/222252?v=4&size=40){kind=avatar}
0 commit comments