Markdown Cheat Sheet

2026-08-01

This post serves as a living document detailing the Markdown syntax supported by our custom Caddy rendering engine.

Frontmatter (Post Metadata)

Every note can include a YAML frontmatter block at the very top. Our layout engine reads this to generate page titles, dates, meta tags for SEO/social previews, and to manage publication status:

---
title: "Your Post Title"
date: "YYYY-MM-DD"
description: "A short summary for search engine results and social card previews."
draft: false
---

title: Injected into the page <title>, Open Graph tags, and the top <h1>.
date: Publication date (YYYY-MM-DD). Drives chronological sorting on the Notes index.
description (optional): Summary used for Google search snippets and Discord/Twitter preview cards.
draft (optional): Set to true to keep the note hidden from the public /notes index while drafting.

Headers

To create a header, add one to six # symbols before your heading text.

# H1 Header (Page Title)
## H2 Header
### H3 Header
#### H4 Header
##### H5 Header
###### H6 Header

H2 Header Example

H3 Header Example

H4 Header Example

H5 Header Example

H6 Header Example

Text Formatting

Basic Styles

You can format text using asterisks * or underscores _.

**Bold Text** or __Bold Text__

*Italic Text* or _Italic Text_

***Bold and Italic*** or ___Bold and Italic___

~~Strikethrough~~

Bold Text or Bold Text

Italic Text or Italic Text

Bold and Italic or Bold and Italic

~~Strikethrough~~

Line Breaks

To force a line break without starting a whole new paragraph, simply end a line with two blank spaces, or drop in an HTML <br> tag.

Escaping Characters

If you need to type a Markdown symbol (like an asterisk) without triggering the formatting, put a backslash \ in front of it.

\*This text is surrounded by asterisks, but is not italicized.\*

*This text is surrounded by asterisks, but is not italicized.*

Lists

Unordered Lists

Use asterisks *, pluses +, or minuses - for unordered lists.

* Item 1
* Item 2
  * Sub-item A
  * Sub-item B

Item 1
Item 2
- Sub-item A
- Sub-item B

Ordered Lists

Use numbers followed by periods.

1. First item
2. Second item
   1. Sub-item 1
   2. Sub-item 2

First item
Second item
1. Sub-item 1
2. Sub-item 2

Task Lists

Create checkboxes by using brackets.

- [x] Completed task
- [ ] Incomplete task

Completed task
Incomplete task

Links and Images

Links

Enclose the link text in brackets [ ] and the URL in parentheses ( ).

[Brannigan's Law](/)

Brannigan's Law

Images

Similar to links, but add an exclamation mark ! in front. You can reference local files stored in /media/ or external URLs:

![Alt Text](/media/images/screenshot.png "Optional Title")

Sizing & Aligning Images

Standard Markdown does not support custom dimensions, but you can use an HTML <img> tag with width or inline styles. The aspect ratio is automatically preserved:

<!-- Fixed pixel width -->
<img src="/media/images/screenshot.png" alt="Alt Text" width="400">

<!-- Centered sized image -->
<img src="/media/images/screenshot.png" alt="Alt Text" width="400" style="margin: 1.5em auto;">

<!-- Percentage width -->
<img src="/media/images/screenshot.png" alt="Alt Text" style="width: 60%;">

Audio

Embed local audio files (MP3, WAV, OGG) using the standard HTML5 <audio> player:

<audio controls src="/media/audio/sample.mp3"></audio>

Video

Embed local video clips (MP4, WebM) with full browser controls:

<!-- Full container width -->
<video controls src="/media/videos/demo.mp4"></video>

<!-- Fixed pixel width -->
<video controls width="500" src="/media/videos/demo.mp4"></video>

<!-- Percentage width, centered -->
<video controls style="width: 75%; margin: 1.5em auto;" src="/media/videos/demo.mp4"></video>

Blockquotes

Use a greater-than sign > for blockquotes.

> This is a blockquote.
> It spans multiple lines.
>> And can be nested.

This is a blockquote. It spans multiple lines.

And can be nested.

Code

Inline Code

Use a single backtick to format inline code.

To print a string in Python, use the `print()` function.

To print a string in Python, use the print() function.

Code Blocks

Use three backticks to create a code block. To demonstrate this in Markdown, you indent with 4 spaces:

```python
def hello_world():
    print("Hello, World!")
```

def hello_world():
    print("Hello, World!")

Tables

Use pipes | to separate columns and hyphens - to create the header row. Colons : align the text.

| Syntax      | Description | Test Text     |
| :---        |    :----:   |          ---: |
| Header      | Title       | Here's this   |
| Paragraph   | Text        | And more      |

Syntax	Description	Test Text
Header	Title	Here's this
Paragraph	Text	And more

Horizontal Rules

Use three or more asterisks ***, dashes ---, or underscores ___.

---

Raw HTML Injection

Because the layout engine allows raw HTML, you can drop HTML tags directly into the Markdown when you need complex layouts or elements Markdown doesn't support natively (like video embeds, custom styled <div>s, or specific form inputs).

<div style="background-color: #333; padding: 10px; border-radius: 5px; text-align: center;">
    <strong>Raw HTML Div:</strong> <span style="color: #8ab4f8;">This is highly customizable.</span>
</div>

Raw HTML Div: This is highly customizable.