Markdown in 10 minutes

Markdown offers a straightforward way to write formatted documents using plain text. Instead of clicking toolbar buttons, authors use a few simple characters to create headings, lists, links, images, and other elements.

You only need a core set of Markdown features to write effective documentation.

This guide covers all essential syntax requirements to help you start authoring content in CamelMind.

Defining page title and headings in CamelMind

Unlike plain Markdown, CamelMind uses the page frontmatter to specify the page title.

Instead of writing a top-level heading in the document body:

# Document Title Example

define the page title in the frontmatter block:

---
title: Document Title Example
description: Learn how to configure titles in CamelMind.
---

CamelMind automatically renders the page title from the title field.

Begin document content with a level 2 heading (##) for the primary section:

---
title: Document Title Example
description: Learn how to configure titles in CamelMind.
---

## Primary Section Header  {/* toc:exclude */}

Install Node.js before creating your first CamelMind site.

## Secondary Section Header {/* toc:exclude */}

Continue to the installation guide.

Structuring content with heading levels in CamelMind

Organize document content into a logical hierarchy using heading levels.

For example, structure your CamelMind document sections and subsections using the following hierarchy:

## Advanced CamelMind Feature Configuration {/* toc:exclude */}

In this primary section, configure high-level settings for your CamelMind documentation site.

### Primary Feature Settings in CamelMind {/* toc:exclude */}

In this subsection, adjust specific settings for individual feature options.

#### Advanced Optional Feature Options

Customize analytics, search, and authentication parameters.

Creating paragraphs in Markdown

Separate individual paragraphs by inserting a blank line between text blocks.

This is the first paragraph.

This is the second paragraph.

Formatting text with inline styles

Apply emphasis to text using standard inline formatting characters.

Example:

Use **CamelMind** to build beautiful documentation.

Run `npm run dev` to preview your site.

displays as:

Use CamelMind to build beautiful documentation.

Run npm run dev to preview your site.

Creating bulleted and numbered lists

Unordered lists

Use hyphens or asterisks to create bulleted list items:

- Install Node.js
- Create your site
- Start writing

displays as:

• Install Node.js
• Create your site
• Start writing

Ordered lists

Use numbers followed by periods to create ordered list items:

1. Install Node.js
2. Run the CLI
3. Preview your site

displays as:

1. Install Node.js
2. Run the CLI
3. Preview your site

Adding links to documents

Construct hyperlinks using square brackets for link text and parentheses for the target URL.

[Installation](/getting-started/installation)

[Writing Content](/getting-started/writing-content)

[https://camelmind.dev](https://camelmind.dev)

Embedding images in content

Embed images using exclamation marks, square brackets, and parentheses:

![Architecture Diagram](/images/architecture.svg)

Formatting blockquotes

Highlight key quotes or important information callouts.

> Documentation is part of the product.

displays as:

Documentation is part of the product.

Inserting code blocks and syntax highlighting

Enclose multi-line code examples inside triple backtick fences (```).

npm install
npm run dev

Specify a language identifier after the opening backticks to enable syntax highlighting.

Common supported languages include:

• bash
• typescript
• tsx
• json
• yaml
• html
• css

Example:

- label: Home
  slug: /

Formatting data with tables

Construct structured data tables using pipe characters (|).

| Command | Description |
| --- | --- |
| `npm install` | Install project dependencies |
| `npm run dev` | Start the development server |

displays as:

Adding tooltips to Markdown links

CamelMind supports link tooltips using standard Markdown syntax.

Add a title string in double quotation marks after the target URL:

[Installation Guide](/getting-started/installation "Create your first CamelMind site")

[Node.js](https://nodejs.org/ "JavaScript runtime used by CamelMind")

When users hover over the link, the browser displays the title string inside a tooltip popup.

Installation Guide

Node.js

Inserting horizontal section dividers

Separate distinct sections using three consecutive dashes.

---

displays as:

Escaping special Markdown characters

To render Markdown formatting syntax as literal text, precede the character with a backslash (\).

\# This is not a heading

displays as:

# This is not a heading

Comparing Markdown versus MDX in CamelMind

Standard Markdown satisfies requirements for most documentation pages.

When pages require complex component layouts, CamelMind allows authors to combine Markdown content with React components through MDX.

For example, instead of writing a basic blockquote:

> Remember to restart the server.

authors can insert a Callout component:

<Callout type="tip">
Restart the development server after changing your configuration.
</Callout>

CamelMind includes built-in MDX components that function out of the box without requiring manual import statements. See Use MDX Components for complete usage instructions.

Next step: Start authoring documentation

Congratulations! 🎉

You now have full knowledge of essential Markdown syntax for CamelMind authoring.

Most documentation pages rely on the syntax detailed in this guide. As your documentation suite grows, incorporate CamelMind built-in MDX components to construct interactive, engaging content pages. Continue to Writing Content to create your first page.