การใช้งานภาษา Markdown ที่เราใช้กันบ่อยในไฟล์ Readme.md บน git repository หรืออาจจะประยุกต์ไปใช้กับการสร้างเนื้อหาบน blog โดยใช้วิธีการบันทึกเนื้อหาเป็นแบบ Markdown ในบทความนี้เราจะดูวิธีการใช้งานภาษา Markdown ว่ามีฟังก์ชันการใช้งานอะไรให้ใช้กันบ้าง
What is Markdown ?
Markdown เป็นสไตล์ของข้อความบนเว็บ เราสามารถควบคุมการแสดงผลของเอกสาร ฟอร์เม็ทที่เป็นตัวหนา ตัวเอง เพิ่มรูปภาพ สร้างรายการหัวข้อ เป็นต้น ทั้งหมดนี้เราสามารถใช้ Markdown ทำได้เลย และยิ่งกว่านั้น Markdown เป็นแค่ ข้อความปกติ กับสัญลักษณ์บางตัว เช่น # หรือ * มันง่ายต่อการทำความเข้าใจและนำไปใช้
เราสามารถใช้ Markdown บน GitHub เช่น Gist, การคอมเม้นปัญหาและ Pull Requests, ไฟล์นามสกุล .md หรือ .markdown
ตัวอย่างการใช้งาน Markdown
Text
It's very easy to make some words **bold** and other words *italic* with Markdown. You can even [link to Google!](http://google.com)
List
Sometimes you want numbered lists:
1. One
2. Two
3. Three
Sometimes you want bullet points:
* Start a line with a star
* Profit!
Alternatively,
- Dashes work just as well
- And if you have sub points, put two spaces before the dash or star:
- Like this
- And this
Images
If you want to embed images, this is how you do it:
![Image of Yaktocat](https://octodex.github.com/images/yaktocat.png)
Headers & Quotes
# Structured documents
Sometimes it's useful to have different levels of headings to structure your documents. Start lines with a `#` to create headings. Multiple `##` in a row denote smaller heading sizes.
### This is a third-tier heading
You can use one `#` all the way up to `######` six for different heading sizes.
If you'd like to quote someone, use the > character before the line:
> Coffee. The finest organic suspension ever devised... I beat the Borg with it.
> - Captain Janeway
Code
There are many different ways to style code with GitHub's markdown. If you have inline code blocks, wrap them in backticks: `var example = true`. If you've got a longer block of code, you can indent with four spaces:
if (isAwesome){
return true
}
GitHub also supports something called code fencing, which allows for multiple lines without indentation:
```
if (isAwesome){
return true
}
```
And if you'd like to use syntax highlighting, include the language:
```javascript
if (isAwesome){
return true
}
```
Extras
GitHub supports many extras in Markdown that help you reference and link to people. If you ever want to direct a comment at someone, you can prefix their name with an @ symbol: Hey @kneath — love your sweater!
But I have to admit, tasks lists are my favorite:
- [x] This is a complete item
- [ ] This is an incomplete item
When you include a task list in the first comment of an Issue, you will see a helpful progress bar in your list of issues. It works in Pull Requests, too!
And, of course emoji!
Syntax guide
Headers
# This is an <h1> tag
## This is an <h2> tag
###### This is an <h6> tag
Emphasis
*This text will be italic*
_This text will be italic_
**This text will be bold**
__This text will be bold__
_You **can** combine them_
List
Unordered
* Item 1
* Item 2
* Item 2a
* Item 2b
Ordered
1. Item 1
1. Item 2
1. Item 3
1. Item 3a
1. Item 3b
Images
![GitHub Logo](/images/logo.png)
Format: ![Alt Text](url)
Links
http://github.com - automatic!
[Github](http://github.com)
Blockquoutes
As Kanye West said:
> We're living the future so
> the present is our past.
Inline code
I think you should use an
`<addr>` element here instead.
Markdown ที่สามารถใช้ร่วมกับ GitHub ได้
Syntax highlighting
```javascript
function fancyAlert(arg) {
if(arg) {
$.facebox({div:'#foo'})
}
}
```
Task Lists
[x] @mentions, #refs, [links](), formatting, and tags supported
[x] list syntax required (any unordered or ordered list supported)
[x] this is a complete item
[ ] this is an incomplete item
Tables
First Header | Second Header
------------ | -------------
Content from cell 1 | Content from cell 2
Content in the first column | Content in the second column
SHA references : GitHub จะแปลงข้อความที่เป็น SHA-1 hash เป็นลิ้งค์ ไปยัง commit ใน git repository ให้อัตโนมัติ
16c999e8c71134401a78d4d46435517b2271d6ac
mojombo@16c999e8c71134401a78d4d46435517b2271d6ac
mojombo/github-flavored-markdown@16c999e8c71134401a78d4d46435517b2271d6ac
Issue reference within a repository
1
mojombo#1
mojombo/github-flavored-markdown#1
Username @mentions
@username
Automatic linking for URLs : GitHub จะแปลงข้อความที่อยู่ในรูปแบบของ URL ให้เป็นลิ้งค์ไปยัง url นั้นให้อัตโนมัติ
Strikethrough
~~this~~
Emoji : emoji! และ Emoji Cheat Sheet
ตัวอย่างหน้า Readme ใน GitHub
การสร้าหน้า Readme สวยๆ ใน GitHub นั้นเป็นไฟล์ .md ทั้งหมด
อ้างอิง : https://guides.github.com/features/mastering-markdown/