Markdown Syntax and Features Page

Docusaurus supports Markdown and a few additional features.

Now, if you want to include the Message component, it's available in all MDX documents!

MDX gives you JSX in Markdown!

The Chart is also available since it was passed into the MDXProvider:

Headings start with a hash 1 hash for heading 1, 2 for h2 etc.

ONLY H2 & H3 will add link to the RHS nav panel in docusaurus

Markdown Heading 1#

Markdown Heading 2#

Markdown Heading 3#

Markdown Heading 4#

Markdown Heading 5#

Markdown Heading 6#

HyperLinks#

Markdown text with internal link label in [ ] square brackets and link in ( ) parentheses

Markdown text with external link. to the Markdown syntax site

Here is an external hyperlink to an md doc do not put the dotmd in link.

Italics#

Italicized text is inside a single asterixes.

Bold#

Bold text is inside double asterixes.

Paragraphs#

are simply 'entered down' in code file

Like this, dont put an indent.

Line Breaks#

Line Breaks have two spaces after the first (previous) line.

images#

images have an ! folowed by alt text in square brackets [ ] and image link inside parentheses ( ) .

code sample#

to add a sample code window, use triple ` followed by jsx title= then link in quoatation marks ENTER

then enter code, end it with triple ` again

src/components/HelloDocusaurus.js

function HelloDocusaurus() {
    return (
        <h1>Hello, Docusaurus!</h1>
    )
}

alerts - green, yellow red#

Use Triple colon : followed by tip, danger or caution then Heading words then Enter

for label text

end it with triple colon :

My tip

Use this awesome feature option

Take care

This action is dangerous

Warning

This is a warning

MDX and React Components#

MDX can make your documentation more interactive and allows using any React components inside Markdown:

highlighted text with color and text#

create custom css and onclick functions for spans like the highlights below

This is Docusaurus green !

This is Facebook blue !

Front Matter#

Markdown documents have metadata at the top called Front Matter:

my-doc.md

---
id: my-doc-id
title: My document title
description: My document description
slug: /my-custom-url
---

## Markdown heading

Markdown text with [links](./docusaurus-getting-started-manual.md)

Links#

Regular Markdown links are supported, using url paths or relative file paths.

Let's see how to [Create a page](/docusaurus-getting-started-manual).

Let's see how to [Create a page](./docusaurus-getting-started-manual.md).

Result: Let's see how to Create a page.

Images#

Regular Markdown images are supported.

Add an image at static/img/logo.png and display it in Markdown:

![Docusaurus logo](/img/logo.png)

Code Blocks#

Markdown code blocks are supported with Syntax highlighting.

```jsx title="src/components/HelloDocusaurus.js"
function HelloDocusaurus() {
    return (
        <h1>Hello, Docusaurus!</h1>
    )
}
```

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

:::

My tip

Use this awesome feature option

Take care

This action is dangerous