The Ultimate Guide to Markdown

markdown_guide.md

Markdown Guide

Basic Markdown Formatting

Headings

# This is an <h1> tag
## This is an <h2> tag
### This is an <h3> tag
#### This is an <h4> tag
##### This is an <h5> tag
###### This is an <h6> tag

Emphasis

*This text will be italic*
_This will also be italic_

**This text will be bold**
__This will also be bold__

_You **can** combine them_

Result:

This text will be italic

This will also be italic

This text will be bold

This will also be bold

You can combine them

Lists

Inordered:

* Milk
* Bread
    * Wholegrain
* Butter

Result:

• Milk
• Bread
  • Wholegrain
• Butter

Ordered:

1. Tidy the kitchen  
2. Prepare ingredients  
3. Cook delicious things

Result:

1. Tidy the kitchen
2. Prepare ingredients
3. Cook delicious things

Images

![Alt Text](url)

Result:

Links

[link](http://example.com)

Result:

link

Blockquotes

As Kanye West said:

> We're living the future so
> the present is our past.

Result:

As Kanye West said:

We're living the future so the present is our past.

Horizontal Rules

---

Result:

---

Code Snippets

Indenting by 4 spaces will turn an entire paragraph into a code-block.

Result:

.my-link {
    text-decoration: underline;
}

Reference Lists & Titles

**The quick brown [fox][1], jumped over the lazy [dog][2].**

[1]: https://en.wikipedia.org/wiki/Fox "Wikipedia: Fox"
[2]: https://en.wikipedia.org/wiki/Dog "Wikipedia: Dog"

Result:

The quick brown fox, jumped over the lazy dog.

Escaping

\*literally\*

Result:

*literally*

Embedding HTML

<button class="button-save large">Big Fat Button</button>

Result:

Big Fat Button

Advanced Markdown

Note: Some syntax which is not standard to native Markdown. They're extensions of the language.

Strike-throughs

~~deleted words~~

Result:

deleted words

Highlights

Work in Ghost:

==oooh fancy==

Result:

==oooh fancy==

Automatic Links

https://ghost.org

Result:

https://ghost.org

Markdown Footnotes

Work in Ghost:

The quick brown fox[^1] jumped over the lazy dog[^2].

[^1]: Foxes are red
[^2]: Dogs are usually not red

Result:

The quick brown fox¹ jumped over the lazy dog².

GitHub Flavored Markdown

Syntax Highlighting

```javascript
function fancyAlert(arg) {
  if(arg) {
    $.facebox({div:'#foo'})
  }
}
```

Result:

function fancyAlert(arg) {
  if(arg) {
    $.facebox({div:'#foo'})
  }
}

Task Lists

- [x] @mentions, #refs, [links](), **formatting**, and <del>tags</del> supported
- [x] list syntax required (any unordered or ordered list supported)
- [x] this is a complete item
- [ ] this is an incomplete item

Result:

• @mentions, #refs, links, formatting, and tags supported
• list syntax required (any unordered or ordered list supported)
• this is a complete item
• this is an incomplete item

Tables

You can create tables by assembling a list of words and dividing them with hyphens - (for the first row), and then separating each column with a pipe |:

First Header	Second Header
Content from cell 1	Content from cell 2
Content in the first column	Content in the second column

SHA references

Any reference to a commit’s SHA-1 hash will be automatically converted into a link to that commit on GitHub.

16c999e8c71134401a78d4d46435517b2271d6ac
mojombo@16c999e8c71134401a78d4d46435517b2271d6ac
mojombo/github-flavored-markdown@16c999e8c71134401a78d4d46435517b2271d6ac

Issue references within a repository

Any number that refers to an Issue or Pull Request will be automatically converted into a link.

#1
mojombo#1
mojombo/github-flavored-markdown#1

Username @mentions

Typing an @ symbol, followed by a username, will notify that person to come and view the comment. This is called an “@mention”, because you’re mentioning the individual. You can also @mention teams within an organization.

Emoji

GitHub supports emoji! Check out the Emoji Cheat Sheet.

References

• http://blog.ghost.org/markdown/
• https://guides.github.com/features/mastering-markdown/

Footnotes

1. Foxes are red ↩

2. Dogs are usually not red ↩

Can I insert plain HTML?

<button> doesn't work (in 2021).

Can I insert plain HTML?

yes you can.

Just a note for myself. You can underline with html tag:

<ins>Hello World</ins> => Hello World

Scwestbrook, yes you can use some HTML tags for additional styling. I tested all the tags and found the ones that work. Check out my Markdown Cheatsheet

@cuonggt Add this

Highlighting the changes

'''diff

plus(+) new code
minus(-) old code

'''
Result:

+ new code
- old code

Collapsible sections using

<details>
   <summary></summary>
</details>

For example

    <details>
    <summary>Recursive quicksort implemented in Raku.</summary>

    ```raku
    multi quicksort([]) { () }
    multi quicksort([$pivot, *@rest]) {
        my $before := @rest.grep(* before $pivot);
        my $after  := @rest.grep(* !before $pivot);
        flat quicksort($before), $pivot, quicksort($after)
    }
    ```
    </details>

results in

Recursive quicksort implemented in Raku.

 multi quicksort([]) { () }
 multi quicksort([$pivot, *@rest]) {
     my $before := @rest.grep(* before $pivot);
     my $after  := @rest.grep(* !before $pivot);
     flat quicksort($before), $pivot, quicksort($after)
 }

THIS GITHUB IS MADE BY STREAMLIT!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!

https://imgur.com/a/eEx6ztq