Markdown Overview
Markdown is a simple way to format text that is both human readable and can also be easily converted to a webpage. It's goal is author cleanly and display richly. And personally, I find that it translates really well into how I want to *write* out of the box.
Markdown powers Stack Overflow, Github, and a good chunk of the internet, while offering a delicate balance between robust expressiveness in typography, human readability on all platforms, and amazingly simple full text search.
If you're just getting started there are a couple symbols to remember that will help translate text into TEXT! There are plenty of online guides already detailing various flavors, but here's a brief overview contextualized into this site, including which elements are available and how they are displayed.
For some external quick reference guides, you can check out CommonMark or the original Markdown Syntax documentation by John Gruber. If you're converting existing info to Markdown, try Paste 2 Markdown
Markdown Editor / Viewer #
For folks getting started with markdown, I highly recommend using an editor that formats markdown while you type. One online option is StackEdit.io.
If you're working with local files, I highly recommend downloading Visual Studio Code and installing the following extensions:
- Markdown All in One by Yu Zhang
- Markdown Preview Enhanced by Yiyi Wang
- Markdown Lint by David Anson
Syntax Guide #
Text #
*italics*
**bold**
~~muted~~
`inline-code`
italics
bold
muted
inline-code
Blockquote #
> Blockquote **bold**
Blockquote bold
Headers #
# h1 - Primary
## h2 - Secondary
### h3 - Tertiary
#### h4 - Quaternary
h1 - Primary
h2 - Secondary
h3 - Tertiary
h4 - Quaternary
Resources #
[link text](http://example.com/)
![img alt text](/assets/heart.svg)
Lists #
* un-ordered list
* eggs
* milk
- un-ordered list
- eggs
- milk
1. ordered list
2. home
3. go to 2
- ordered list
- home
- go to 2
Horizontal Rule #
Three Dashes: ---
OR three Astrix: ***
OR three Underscore: ___
Tables #
Here's an awesome markdown table generator if you're copying data from another source
| Name | Age | | ----- |:----:| | Frida | 10 | | Buddy | 12 | | Gus | 5 |
Name | Age |
---|---|
Frida | 10 |
Buddy | 12 |
Gus | 5 |
Syntax Highlighting #
For more info on supported languages, see syntax highlighting
```js
var pet = {
name: "Frida",
age: 13
}
```
var pet = {
name: "Frida",
age: 13
}
Extensions #
Inline Text #
++inserted++
==mark==
inserted
mark
Checkbox Lists #
[ ] unchecked item
[x] checked item
Spoiler #
!!Secret!!
Secret
Definition List #
Term 1
~ Definition 1
Term 2
: Definition 2
- Term 1
- Definition 1
- Term 2
- Definition 2
File #
$$\\nessie\prog\Software\$$
Nunjucks Filters #
Embed Tweet #
Use Like This #
{% tweet "1188837207206977536" %}
Which Displays Like This #
Nobody:
Software Marketing Page: "Blazingly Fast"