Skip to main content

MDX Blog Post

· One min read
Rajath Jaiprakash
Rajath Jaiprakash
Site Reliability Engineer @ Akamai

I keep forgetting how to write MDX blog posts, so I created this blog post as a reference.

Truncating the summary of a blog post​

Use a <!-- truncate --> comment to limit blog post size in the list view for md.

Use a {/* truncate */} comment to limit blog post size in the list view for mdx.

Blog post features​

Blog posts support Docusaurus Markdown features, such as MDX.

:::tip
Use the power of React to create interactive blog posts.
:::
tip

Use the power of React to create interactive blog posts.

For example, use JSX to create an interactive button:

<button onClick={() => alert('button clicked!')}>Click me!</button>

Adding Media​

A blog post folder can be convenient to co-locate blog post images:

![Docusaurus Plushie](./docusaurus-plushie-banner.jpeg)

Docusaurus Plushie

Adding Tags​

The blog supports tags as well!

tags: [docusaurus, mdx]