워드프레스에 블로깅하기에 반드시 필요해보여 스크랩해놨다.
출처 : 워드프레스 마크다운(Markdown) 문법 설명
워드프레스 마크다운(Markdown) 문법 설명
WordPress.com에서는 2013년 11월 19일부터 마크다운(Markdown)을 지원하기 시작했다. 그리고 얼마전에 발표한 Jetpack 2.8에서 마크다운을 지원하게 되어서 설치형 워드프레스에서도 마크다운을 간편하게 사용할 수 있게 되었다.
아래의 표는 워드프레스 Support 페이지에 있는 Markdown quick reference를 번역하고, 몇가지 문법을 더 추가한 것이다. 표로 만들었기 때문에 화면이 작은 모바일 디바이스에서는 제대로 보이지 않을 수 있다.
워드프레스에서 지원하는 마크다운(Markdown) 문법은 기본 마크다운 문법에 Markdown Extra의 문법과 GitHub Flavored Markdown의 문법도 일부 수용한 형태로 되어 있다. 그래서 기본적인 마크다운의 문법보다는 기능이 더 많고, 조금 더 복잡하다. 하지만 블로그에 글을 쓸 때, 그 모든 문법을 알아야하는 것은 아니다. 아마 대부분의 사람들이 아래 표에 정리한 정도의 문법만으로도 블로그를 운영하기에는 충분할 것이다. 좀 더 자세한 설명이 필요하거나, 더 많은 문법을 알고 싶을 때는 아래 링크를 참조하면 된다.
- Markdown: Syntax – Daring Fireball
- PHP Markdown Extra – michelf.ca
- 마크 다운 문법 가이드 – Song Young-Jin
- 직접 정리한 MarkDown 문법 배우기 자료 – Seoulrain
마크다운 | 변환후 모습 | |||||
---|---|---|---|---|---|---|
강조 |
*기울여쓰기(italic)* _기울여쓰기(italic)_ **굵게쓰기(bold)** __굵게쓰기(bold)__ 이 때 * 과 _ 사이에는 공백이 있어서는 않된다. |
기울임 굵은글씨 “기울여쓰기”는 HTML에서 “em”태그를, “굵게쓰기”는 HTML에서 “strong” 태그를 의미한다. 따라서 css에서 그 태그들이 어떻게 보여지도록 설정되었는지에 따라 보여지는 모습이 달라질 수 있다. 즉, 워드프레스 테마에 따라 “기울여쓰기”와 “굵게쓰기”의 모양이 달라질 수 있다는 뜻이다. |
||||
인라인 링크 |
[링크](http://example.com "링크제목"). 대부분의 브라우저에서는 마우스 커서를 링크에 가져가면 링크제목이 뜬다. |
링크. | ||||
참조 링크 |
[링크1][1] 과 [링크2][2]. [1]: http://example.com/ "링크제목1" [2]: http://example.org/ "링크제목2" 참조 부분은 문서의 어떤 부분에 있어도 상관 없다. 그리고 주의해야할 것 중 하나는, 참조부분에서 []과 :는 꼭 붙어있어야 한다는 것이다. |
링크1 과 링크2. | ||||
URL만으로 링크하기 |
<http://example.com/> <me@privacy.net> |
http://example.com me@privacy.net |
||||
인라인 이미지 |
로고:  · 대체텍스트는 시각장애인용 브라우저를 이용할 때 그 이미지가 어떤 것을 가리키는지를 설명하는 용도로 사용된다. · /wp.png 부분에 이미지주소를 넣어주면 된다. |
로고: ![]() |
||||
참조 이미지 |
더 작은 로고: ![대체텍스트][1] [1]: /wp-smaller.png "이미지제목" |
더 작은 로고: ![]() |
||||
링크된 이미지 |
링크된 로고: [] (http://wordpress.com/ "링크제목") |
링크된 로고: ![]() |
||||
수평선 |
--- *** ___ 수평선을 그리고 싶으면 -, *, _ 를 3개 이상 나열하면 된다. 이 때 “- – -“와 같은 식으로 중간에 공백을 넣어도 상관없다. |
|
||||
각주 (FOOTNOTES) |
각주 [^1] 는 이렇게 만든다. [^1]: 각주다. 각주는 문서의 가장 밑에 원래 읽던 곳으로 돌아갈 수 있는 링크와 함께 추가된다. |
각주 1 는 이렇게 만든다.
|
||||
줄넘기기 (개행) |
각 라인의 끝에 2개 이상의 스페이스를 넣으면 줄 넘기기(개행)가 된다. HTML에서와 같이 마크다운(Markdown)에서도, 에디터상에서 엔터를 쳐서 줄을 넝겨도 브라우저상에서 표현될 때는 줄이 넘겨지지 않은 상태로 나온다. |
각 라인의 끝에 2개 이상의 스페이스를 넣으면 줄 넘기기(개행)가 된다. |
||||
문단 나누기 |
문단1 이다. 문단2 이다. 문단을 나눌 때는 문단과 문단 사이에 한 줄을 비워놓으면 된다. |
문단1 이다.문단2 이다. | ||||
순서없는 리스트 (BULLET LISTS) |
* 목록 * 목록 - 목록 - 목록 순서없는 리스트를 작성하기 위해서는 -, +, *을 맨앞에 적으면 된다. |
|
||||
순서있는 리스트 (NUMBERED LISTS) |
1. 목록 1. 목록 순서있는 리스트를 작성하기 위해서는 숫자 다음 .을 찍는다. 적힌 숫자랑 상관없이 순서대로 번호가 매겨진다. |
|
||||
혼합 목록 (순서있는 리스트와 순서없는 리스트를 함께 쓰기) |
1. 목록 2. 목록 * 혼합 목록 * 혼합 목록 3. 목록 |
|
||||
인용 (BLOCKQUOTES) |
> 인용문. > > 인용문안의 인용문. > * 인용 목록 > * 인용 목록 |
인용문의 모양은 css에 어떻게 모양이 정의되었는지에 따라 달라진다. 따라서 테마를 바꾸면 인용문의 모양도 달라질 수 있다. |
||||
서식 설정 텍스트 (PREFORMATTED) |
각각의 줄을 2개 이상의 스페이스로 시작하면 글을 타이핑하는 그대로 정확히 보여지게 할 수 있다. [test](http://test.com) 서식 설정 텍스트 태그는 마크다운이나 HTML 태그등을 그대로 보여주고자 할 때 사용하면 된다. |
각각의 줄을 2개 이상의 스페이스로 시작하면 글을 타이팅하는 그대로 정확히 보여지게 할 수 있다. [test](http://test.com) |
||||
코드 |
`코드이다. [test](http://test.com)` |
코드이다. [test](http://test.com) |
||||
코드 블럭 |
~~~~ 이것은 코드 블럭이다. ~~~~ ``` 이것도 코드 블럭이다. ``` |
|
||||
문법 강조 |
```css #button { border: none; } ``` 이 문법은 wordpress.com에서만 지원된다. 설치형 워드프레스에서는 지원되지 않는다. 설치형 워드프레스에서는 코드블럭으로 보여진다. 지원되는 언어는 Posting Source Code에서 확인할 수 있다. |
|
||||
제목 |
# 제목 1 ## 제목 2 ### 제목 3 #### 제목 4 #### ##### 제목 5 ##### ###### 제목 6 ###### #을 앞, 뒤에 모두 붙여도 되고, 앞에만 붙여도 된다. |
제목 1제목 2제목 3제목 4제목 5제목 6 |
||||
정의 목록 (DEFINITION LISTS) |
WordPress : 세계 최대의 오픈 소스 저작물 관리 시스템 Markdown : 일반 텍스트 문서를 HTML로 변환하는 도구 |
정의 목록의 모양은 css에 어떻게 모양이 정의되었는지에 따라 달라진다. 따라서 테마를 바꾸면 정의 목록의 모양도 달라질 수 있다. |
||||
(축)약어 (ABBREVIATIONS) |
마크다운(Markdown)은 일반 텍스트를 HTML로 변환한다. *[HTML]: HyperText Markup Language (축)약어의 정의는 문서의 어떤 곳에든 있을 수 있다. |
마크다운(Markdown)은 일반 텍스트를 HTML로 변환한다. | ||||
인라인 HTML |
<img src="/wp.png" align=right> 마크다운 문서를 작성할 때 마크다운으로 표현할 수 없는 것은 HTML을 이용해서 표현할 수 있다. 다만 주의해야할 것이 있다. 원래 마크다운 문법에서는 <div>, <table>, <pre>, <p>등의 블럭 엘리먼트들은 앞뒤에 빈 줄이 있어야 했지만, 워드프레스에는 markdown extra의 문법이 적용되어 있어서 그럴 필요가 없다. 다만 블럭 엘리먼트를 쓸 때는 앞에 3개 이상의 스페이스를 쓰면 안된다. 그러면 그 부분을 “서식 설정 텍스트”로 인식한다. |
![]() |