MarkDown Cheat Sheet
Panduan singkat cheat sheet shortcut keyboard markdown.
Daftar Isi
Apa itu Markdown
Membuat artikel untuk dipublish ke web dengan format Markdown akan memudahkan dan mempercepat workflow. Semua file markdown akan dikonversi menjadi file dengan format HTML.
Jadi output dokumen akan menjadi sebuah file dengan format html secara sempurna. Anda bisa menggunaan format penulisan markdown melalui wordpress gutenberg saat ini.
Kenapa menggunakan Markdown
Markdown memiliki format yang outputnya sama dengan file html biasa.
Markdown akan mengenali yang mana text yang akan dibungkus dengan tag <p>
dan yang mana bukan.
Tidak seperti format html keluaran Blogger jaman dulu yang mana masih menggunakan <div>
pada setiap paragraf.
Jadi file html kita jadi lebih bersih, dan seo friendly.
Dimana menggunakan markdown?
Anda bisa menggunakan markdow saat menulis di :
- GitHub
- Stack Overflow
- Slack
- Membuat artikel Hugo
- Wordpress Gutenberg dan lain sebagainya
Syntax Markdown
Berikut syntax penulisan file menggunakan markdown.
Headings
# Heading 1
## Heading 2
### Heading 3
#### Heading 4
##### Heading 5
###### Heading 6
Paragraphs
This is a paragraph.
This is another paragraph.
Blockquotes
> This is a blockquote.
>
> > This is a nested blockquote.
Lists
Unordered Lists
- Item 1
- Item 2
- Item 2a
- Item 2b
atau
- Item 1
- Item 2
- Item 2a
- Item 2b
atau
- Item 1
- Item 2
- Item 2a
- Item 2b
atau
- [ ] Item 1
- [x] Item 2
Ordered Lists
1. Item 1
2. Item 2
3. Item 3
1. Item 3a
2. Item 3b
atau
A. Item 1
B. Item 2
C. Item 3
A. Item 3a
B. Item 3b
Code
Inlined code:
`code()` is a function.
Code blocks:
```javascript
function fancyAlert(arg) {
if (arg) {
$.facebox({ div: '#foo' });
}
}
```
~~~html
<div id="foo">
<h1>Foo</h1>
</div>
~~~
Horizontal Rules
Hyphens
---
Asterisks
***
Underscores
___
Links
[GitHub](https://github.com)
[GitHub](https://github.com "GitHub")
[GitHub]: https://github.com "GitHub"
<https://github.com>
<https://github.com "GitHub">
Images
![GitHub Logo](/images/logo.png)
![GitHub Logo](/images/logo.png "GitHub Logo")
![GitHub Logo](/images/logo.png)(https://github.com)
![GitHub Logo][logo]
[logo]: /images/logo.png "GitHub Logo"
Tables
| Syntax | Description |
| --------- | ----------- |
| Header | Title |
| Paragraph | Text |
| Syntax | Description |
| :-------- | :---------- |
| Header | Title |
| Paragraph | Text |
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_
Strikethrough
~~This was mistaken text~~
Backslash escapes
Characters | Escape sequences | Description |
---|---|---|
\ | \\ | Backslash |
* | \* | Asterisk |
_ | \_ | Underscore |
` | \` | Backtick |
{ | \{ | Opening curly brace |
} | \} | Closing curly brace |
[ | \[ | Opening bracket |
] | \] | Closing bracket |
( | \( | Opening parenthesis |
) | \) | Closing parenthesis |
# | \# | Hash mark |
+ | \+ | Plus sign |
- | \- | Hyphen-minus |
. | \. | Period |
! | \! | Exclamation mark |