markdown
🌱 This post is in the growth phase. It may still be useful as it grows up.
This document describes markdown in terms of Prettier defaults. If you don’t use prettier, find syntax alternatives on Daring Fireball.
Many examples have been used from the Daring Firebal documentation.
GitHub Flavored Markdown (GFM)
Most code environments use custom Markdown parser called GitHub Flavored Markdown (GFM).
The most notable difference is how GFM handles code blocks — using a code fence.
I include (GFM)
where GFM-specific syntax is demonstrated.
Contents
- Headings
- Blockquote
- Lists
- Lists of paragraphs
- Lists with markdown
- Code inline
- Code block (GFM)
- Horizontal Rule
- Link
- Emphasis
- Emphasis
- Image
- details
Headings
# Heading level 1
## Heading level 2
### Heading level 3
#### Heading level 4
##### Heading level 5
###### Heading level 6
Blockquote
> This is a blockquote with two paragraphs. Lorem ipsum dolor sit amet,> consectetuer adipiscing elit. Aliquam hendrerit mi posuere lectus.> Vestibulum enim wisi, viverra nec, fringilla in, laoreet vitae, risus.>> Donec sit amet nisl. Aliquam semper ipsum sit amet velit. Suspendisse> id sem consectetuer libero luctus adipiscing.
Nested blockquote
This is the first level of quoting.
This is nested blockquote.
Back to the first level.
Blockquotes support markdown
This is a header.
- This is the first list item.
- This is the second list item.
Here’s some example code:
return shell_exec("echo $input | $markdown_script");
Examples from Daring Fireball
Lists
Unordered
- Folklore- Evermore- Midnights
Ordered
Ordered lists are alway consecutive.
The only number that makes a difference is first. Anything other than 1
, sets the start
value on the <ol>
.
8. Folklore1. Folklore1. Evermore1. Folklore
output:
<ol start="8"> <li>Folklore</li> <li>Folklore</li> <li>Evermore</li> <li>Folklore</li></ol>
Lists of paragraphs
1. This is a list item with two paragraphs. Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aliquam hendrerit mi posuere lectus.
Vestibulum enim wisi, viverra nec, fringilla in, laoreet vitae, risus. Donec sit amet nisl. Aliquam semper ipsum sit amet velit.
2. Suspendisse id sem consectetuer libero luctus adipiscing.
Lists with markdown
- A list item with a blockquote: > This is a blockquote > inside a list item.- A list item with a code block: ``` Code goes here ```
Code inline
`<em>love it!</em>`
``There is a literal backtick (`) here.``
Code block (GFM)
```jslet GOAT = 'Taylor Swift'console.log(GOAT)```
Nested markdown code
Add more backticks for infinite nesting.
````md```jslet GOAT = 'Taylor Swift'console.log(GOAT)```````
Horizontal Rule
---
Link
This syntax can often be hard to remember.
Someone recommended thinking of it as calling a named function with the url. It’s stuck with me ever since.
Basic
[chan.dev](https://chan.dev/ 'optional title')
Automatic
<https://chan.dev>
Automatic entity encoded email
Output:
<a href="mailto:address@example.com" >address@exa mple.com</a>
This last part more interesting than anything else. Surely bots decode this.
Reference style
Reference
[chan.dev][site]
Emphasis
_produced an <em> context_**produced an <strong> context**
Mid-word emphasis
un*frigging*believable
Escape empahasis
un\*frigging\*believable
Emphasis
_this is emphasized!_
Definition
[site]: https://chan.dev/ 'Optional Title Here'
- NOT case sensetive.
- CAN be defined anywhere in the document.
I get 10 times more traffic from [Google][] than from[Yahoo][] or [MSN][].
[google]: http://google.com/ 'Google'[yahoo]: http://search.yahoo.com/ 'Yahoo Search'[msn]: http://search.msn.com/ 'MSN Search'
Shorthand reference
<!-- when referencing this definition -->
[my site]: https://chan.dev
<!-- both examples are identical-->
[my site][][my site][my site]
Image


Reference style
![Alt text][id]
[id]: url/to/image 'Optional title attribute'
See Link for more reference style options.
details
Raw markdown
Markdown supports HTML and, therefore, details. However, in order to put markdowndown inside of a summary, there needs to be additional line-breaks between HTML elements and markdown blocks.
Some disclosure
Markdown can go in here if you leave extra line breaks.
<details> <summary>Some disclosure</summary>
_Markdown can go in here if you leave extra line breaks._</details>
markdown-it plugins
markdown-it-container can be used to create definition lists.