-
Notifications
You must be signed in to change notification settings - Fork 0
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
Signed-off-by: IO0288 <[email protected]>
- Loading branch information
Showing
7 changed files
with
327 additions
and
0 deletions.
There are no files selected for viewing
4 changes: 4 additions & 0 deletions
4
i18n/en/docusaurus-plugin-content-docs/current/create-new-page/_category_.json
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,4 @@ | ||
{ | ||
"label": "创建新的页面", | ||
"position": 2 | ||
} |
34 changes: 34 additions & 0 deletions
34
...en/docusaurus-plugin-content-docs/current/create-new-page/create-a-blog-post.md
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,34 @@ | ||
--- | ||
sidebar_position: 3 | ||
--- | ||
|
||
# Create a Blog Post | ||
|
||
Docusaurus creates a **page for each blog post**, but also a **blog index page**, a **tag system**, an **RSS** feed... | ||
|
||
## Create your first Post | ||
|
||
Create a file at `blog/2021-02-28-greetings.md`: | ||
|
||
```md title="blog/2021-02-28-greetings.md" | ||
--- | ||
slug: greetings | ||
title: Greetings! | ||
authors: | ||
- name: Joel Marcey | ||
title: Co-creator of Docusaurus 1 | ||
url: https://github.com/JoelMarcey | ||
image_url: https://github.com/JoelMarcey.png | ||
- name: Sébastien Lorber | ||
title: Docusaurus maintainer | ||
url: https://sebastienlorber.com | ||
image_url: https://github.com/slorber.png | ||
tags: [greetings] | ||
--- | ||
|
||
Congratulations, you have made your first post! | ||
|
||
Feel free to play around and edit this post as much you like. | ||
``` | ||
|
||
A new blog post is now available at `http://localhost:3000/blog/greetings`. |
55 changes: 55 additions & 0 deletions
55
.../en/docusaurus-plugin-content-docs/current/create-new-page/create-a-document.md
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,55 @@ | ||
--- | ||
sidebar_position: 2 | ||
--- | ||
|
||
# Create a Document | ||
|
||
Documents are **groups of pages** connected through: | ||
|
||
- a **sidebar** | ||
- **previous/next navigation** | ||
- **versioning** | ||
|
||
## Create your first Doc | ||
|
||
Create a markdown file at `docs/hello.md`: | ||
|
||
```md title="docs/hello.md" | ||
# Hello | ||
|
||
This is my **first Docusaurus document**! | ||
``` | ||
|
||
A new document is now available at `http://localhost:3000/docs/hello`. | ||
|
||
## Configure the Sidebar | ||
|
||
Docusaurus automatically **creates a sidebar** from the `docs` folder. | ||
|
||
Add metadata to customize the sidebar label and position: | ||
|
||
```md title="docs/hello.md" {1-4} | ||
--- | ||
sidebar_label: 'Hi!' | ||
sidebar_position: 3 | ||
--- | ||
|
||
# Hello | ||
|
||
This is my **first Docusaurus document**! | ||
``` | ||
|
||
It is also possible to create your sidebar explicitly in `sidebars.js`: | ||
|
||
```diff title="sidebars.js" | ||
module.exports = { | ||
tutorialSidebar: [ | ||
{ | ||
type: 'category', | ||
label: 'Tutorial', | ||
- items: [...], | ||
+ items: ['hello'], | ||
}, | ||
], | ||
}; | ||
``` |
43 changes: 43 additions & 0 deletions
43
i18n/en/docusaurus-plugin-content-docs/current/create-new-page/create-a-page.md
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,43 @@ | ||
--- | ||
sidebar_position: 1 | ||
--- | ||
|
||
# Create a Page | ||
|
||
Add **Markdown or React** files to `src/pages` to create a **standalone page**: | ||
|
||
- `src/pages/index.js` -> `localhost:3000/` | ||
- `src/pages/foo.md` -> `localhost:3000/foo` | ||
- `src/pages/foo/bar.js` -> `localhost:3000/foo/bar` | ||
|
||
## Create your first React Page | ||
|
||
Create a file at `src/pages/my-react-page.js`: | ||
|
||
```jsx title="src/pages/my-react-page.js" | ||
import React from 'react'; | ||
import Layout from '@theme/Layout'; | ||
|
||
export default function MyReactPage() { | ||
return ( | ||
<Layout> | ||
<h1>My React page</h1> | ||
<p>This is a React page</p> | ||
</Layout> | ||
); | ||
} | ||
``` | ||
|
||
A new page is now available at `http://localhost:3000/my-react-page`. | ||
|
||
## Create your first Markdown Page | ||
|
||
Create a file at `src/pages/my-markdown-page.md`: | ||
|
||
```mdx title="src/pages/my-markdown-page.md" | ||
# My Markdown page | ||
|
||
This is a Markdown page | ||
``` | ||
|
||
A new page is now available at `http://localhost:3000/my-markdown-page`. |
144 changes: 144 additions & 0 deletions
144
...en/docusaurus-plugin-content-docs/current/create-new-page/markdown-features.mdx
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,144 @@ | ||
--- | ||
sidebar_position: 4 | ||
--- | ||
|
||
# Markdown Features | ||
|
||
Docusaurus supports **[Markdown](https://daringfireball.net/projects/markdown/syntax)** and a few **additional features**. | ||
|
||
## Front Matter | ||
|
||
Markdown documents have metadata at the top called [Front Matter](https://jekyllrb.com/docs/front-matter/): | ||
|
||
```text title="my-doc.md" | ||
// highlight-start | ||
--- | ||
id: my-doc-id | ||
title: My document title | ||
description: My document description | ||
slug: /my-custom-url | ||
--- | ||
// highlight-end | ||
## Markdown heading | ||
Markdown text with [links](./hello.md) | ||
``` | ||
|
||
## Links | ||
|
||
Regular Markdown links are supported, using url paths or relative file paths. | ||
|
||
```md | ||
Let's see how to [Create a page](/create-a-page). | ||
``` | ||
|
||
```md | ||
Let's see how to [Create a page](./create-a-page.md). | ||
``` | ||
|
||
**Result:** Let's see how to [Create a page](./create-a-page.md). | ||
|
||
## Images | ||
|
||
Regular Markdown images are supported. | ||
|
||
Add an image at `static/img/docusaurus.png` and display it in Markdown: | ||
|
||
```md | ||
 | ||
``` | ||
|
||
 | ||
|
||
## Code Blocks | ||
|
||
Markdown code blocks are supported with Syntax highlighting. | ||
|
||
```jsx title="src/components/HelloDocusaurus.js" | ||
function HelloDocusaurus() { | ||
return ( | ||
<h1>Hello, Docusaurus!</h1> | ||
) | ||
} | ||
``` | ||
|
||
```jsx title="src/components/HelloDocusaurus.js" | ||
function HelloDocusaurus() { | ||
return <h1>Hello, Docusaurus!</h1>; | ||
} | ||
``` | ||
|
||
## Admonitions | ||
|
||
Docusaurus has a special syntax to create admonitions and callouts: | ||
|
||
:::tip My tip | ||
|
||
Use this awesome feature option | ||
|
||
::: | ||
|
||
:::danger Take care | ||
|
||
This action is dangerous | ||
|
||
::: | ||
|
||
:::tip My tip | ||
|
||
Use this awesome feature option | ||
|
||
::: | ||
|
||
:::danger Take care | ||
|
||
This action is dangerous | ||
|
||
::: | ||
|
||
## MDX and React Components | ||
|
||
[MDX](https://mdxjs.com/) can make your documentation more **interactive** and allows using any **React components inside Markdown**: | ||
|
||
```jsx | ||
export const Highlight = ({children, color}) => ( | ||
<span | ||
style={{ | ||
backgroundColor: color, | ||
borderRadius: '20px', | ||
color: '#fff', | ||
padding: '10px', | ||
cursor: 'pointer', | ||
}} | ||
onClick={() => { | ||
alert(`You clicked the color ${color} with label ${children}`) | ||
}}> | ||
{children} | ||
</span> | ||
); | ||
|
||
This is <Highlight color="#25c2a0">Docusaurus green</Highlight> ! | ||
|
||
This is <Highlight color="#1877F2">Facebook blue</Highlight> ! | ||
``` | ||
|
||
export const Highlight = ({children, color}) => ( | ||
<span | ||
style={{ | ||
backgroundColor: color, | ||
borderRadius: '20px', | ||
color: '#fff', | ||
padding: '10px', | ||
cursor: 'pointer', | ||
}} | ||
onClick={() => { | ||
alert(`You clicked the color ${color} with label ${children}`); | ||
}}> | ||
{children} | ||
</span> | ||
); | ||
|
||
This is <Highlight color="#25c2a0">Docusaurus green</Highlight> ! | ||
|
||
This is <Highlight color="#1877F2">Facebook blue</Highlight> ! |
4 changes: 4 additions & 0 deletions
4
i18n/en/docusaurus-plugin-content-docs/current/create-new-page/temp1/_category_.json
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,4 @@ | ||
{ | ||
"label": "双重折叠", | ||
"position": 5 | ||
} |
43 changes: 43 additions & 0 deletions
43
...n/docusaurus-plugin-content-docs/current/create-new-page/temp1/create-a-page.md
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,43 @@ | ||
--- | ||
sidebar_position: 1 | ||
--- | ||
|
||
# Create a Page | ||
|
||
Add **Markdown or React** files to `src/pages` to create a **standalone page**: | ||
|
||
- `src/pages/index.js` -> `localhost:3000/` | ||
- `src/pages/foo.md` -> `localhost:3000/foo` | ||
- `src/pages/foo/bar.js` -> `localhost:3000/foo/bar` | ||
|
||
## Create your first React Page | ||
|
||
Create a file at `src/pages/my-react-page.js`: | ||
|
||
```jsx title="src/pages/my-react-page.js" | ||
import React from 'react'; | ||
import Layout from '@theme/Layout'; | ||
|
||
export default function MyReactPage() { | ||
return ( | ||
<Layout> | ||
<h1>My React page</h1> | ||
<p>This is a React page</p> | ||
</Layout> | ||
); | ||
} | ||
``` | ||
|
||
A new page is now available at `http://localhost:3000/my-react-page`. | ||
|
||
## Create your first Markdown Page | ||
|
||
Create a file at `src/pages/my-markdown-page.md`: | ||
|
||
```mdx title="src/pages/my-markdown-page.md" | ||
# My Markdown page | ||
|
||
This is a Markdown page | ||
``` | ||
|
||
A new page is now available at `http://localhost:3000/my-markdown-page`. |