Markdown

Frontmatter + Body — The Bread and Butter of Content Sites

Markdown

Markdown files have a YAML frontmatter and a body. Astro parses the body to HTML and exposes the frontmatter via `entry.data`.

4 min read Level 1/5 #astro#markdown#content
What you'll learn
  • Author a Markdown entry
  • Use built-in plugins (footnotes, GFM)
  • Configure Markdown options in `astro.config`

Markdown is the default content format for Astro collections. Each .md file has a YAML frontmatter at the top, then the body.

A Typical File

---
title: Hello, Astro
pubDate: 2026-05-12
tags: [intro, astro]
draft: false
---

# Hello, Astro

Astro is great for **content sites**.

```js
console.log("Code blocks work too");
</Code>

## Frontmatter Is Validated

Whatever your schema declares (next lesson) is what the frontmatter
must match. Missing required fields → build error pointing to the
file. No more "title is undefined" at runtime.

## Built-In Markdown Features

Astro ships with **GitHub-flavored Markdown** out of the box:

- `~~strikethrough~~`
- Tables
- Task lists (`- [x] done`)
- Auto-linking URLs

Code blocks get syntax highlighting via Shiki — works for hundreds
of languages.

## Configuring Markdown

In `astro.config.mjs`:

<Code language="js">
```js
import { defineConfig } from "astro/config";

export default defineConfig({
  markdown: {
    shikiConfig: {
      theme: "github-dark",
    },
    remarkPlugins: [/* … */],
    rehypePlugins: [/* … */],
    syntaxHighlight: "shiki",
  },
});

You can plug in any remark / rehype plugin — anchor links, table of contents, math, custom heading slugs, etc.

Heading IDs

By default, headings get auto-generated id attributes for deep-linking: <h2 id="hello-astro">Hello, Astro</h2>.

Up Next

Markdown plus Astro/JSX components — MDX.

MDX →