Firefox 인기 급상승 부가기능을 구경하다가 놀라운 확장기능을 찾았습니다. Markdown Here 죠!
마크다운
예전에 이 블로그에서 마크다운이 뭔지 소개한 적이 있습니다. 그러니까… 에이 보여드리는 게 낫겠네요.
↓ 아래처럼 쓰면 ↓
### 3단계 제목
문단은 아무 문법 없이 씁니다.
- 목록은 `-` 로 시작합니다.
- 코드는 \` \` 사이에 둡니다. `hello world!`
↓ 이런 의미를 갖습니다. ↓
3단계 제목
문단은 아무 문법 없이 씁니다.
- 목록은
-로 시작합니다. - 코드는 ` ` 사이에 둡니다.
hello world!
맞아요, 마치 프로그래밍 언어처럼 문서 서식을 기술하는 겁니다. 그렇게 쓴 뒤 미리보기를 누르면 지정한 대로 예쁘게 나오죠. 위키위키 문법을 다뤄보셨으면 익숙하실 겁니다. 이런 걸 마크업 언어 라고 합니다.
마크다운은 마크업 문법에서 독보적인 위치를 차지하고 있습니다. 일단 배우기 쉽고 쓰기 쉽고 깔끔하거든요. 미리보기/렌더링을 안 해도 텍스트만으로도 읽기 쉽고, 모양은 신경 안 쓰고 글과 그 구조에만 신경쓸 수 있습니다. 그래서 여러 프로그래밍 문서를 작성하는 데 쓰이거나 심지어 마크다운으로 책을 쓸 수 있는 위키독스 같은 사이트도 존재합니다.
마크다운 히어 (Markdown Here)
마크다운 히어는 이메일 쓰는 화면, 블로그 글 쓰는 화면처럼 글씨 크기 등을 조절할 수 있는 편집기에서 마크다운으로 글을 쓰고 버튼을 누르면 자동으로 서식을 적용한 최종 결과물을 보여줍니다. 물론 거꾸로도 됩니다.
↑위 이미지는 티스토리 첨부파일로 등록되어 있습니다.
그 러 니 까, 그 쓰기 편한 마크다운으로 어디든지 쓰고 바로 토글만 누른 뒤 예쁜 글에 만족하고 이메일을 보내거나 티스토리에서 발행 버튼 같은 걸 누를 수 있다는거죠!!! 천국이네요!!!
이미지 삽입
유일한 단점은 티스토리에서 이미지 삽입이 어렵다는 것 같습니다. 티스토리 특유의 템플릿 문법 때문에 inline HTML이 잘 안 되는 것 같네요… 개발자 도구를 열거나 쌩으로 이미지를 넣어야 될 것 같습니다. 클립보드에서 붙여넣기는 되려나…?
↑ 위 이미지는 Ctrl + CV로 붙여넣어 문서에 내장되어 있습니다. 이게 훨씬 편하네요.
되네요!!! 세상에!!! 이미지 크기만 사전에 잘 조절해서 붙여넣으면 보다 손쉬운 글쓰기가 가능할 것 같습니다. 다만 이렇게 붙여넣은 그림은 티스토리 에디터의 관리 하에 있는 게 아니라 데이터로서 글의 일부로 들어간 이미지인지라 대표이미지 지정은 안 되는 것 같습니다.
이 부가기능은 결과물의 모양(CSS)도 지정할 수 있지만 그건 관심없는지라 언급하지 않겠습니다.
안 되는 곳
제목에 아무데서나 된다고 적었는데, 혹시나 해서 적어놓습니다. 고급 텍스트 편집기를 대상으로 한 부가기능이라 꾸밀 수 없는 곳에서는 동작하지 않습니다. 트위터 글쓰기 화면 같은 곳 말이죠. 안 되는 곳에서는 아래와 같은 경고창이 나옵니다.
그으러니까 네이버 스마트 에디터가 적용된 네이버 카페 등지에서도 충분히 쓸 수 있다는 얘기네요! 다음이나 네이버 카페는 잘 안 쓰지만 괜히 신난다!!!
코드의 강조
지금까지 코드를 티스토리에서 강조하려면 스킨에 하이라이터를 설치하는 등 여러가지 불편한 과정을 거쳐야 했습니다. 하지만 마크다운 히어가 있다면?
fn main() {
println!("WOW! 그냥 마크다운 문법으로 코드영역을 지정했을 뿐인데 코드가 강조되어 나왔어요!");
}
Github-flavoured Markdown
어쩌면 당연하게도 이 확장기능의 마크다운 문법은 Github에서 사용되는 그것과 유사합니다. Github 확장 마크다운 문법에서는 이런 게 되죠.
- [ ] 체크리스트
- [x] 체크된 체크리스트
| 표 |
|---|
| 내용 |
음… 아쉽게도 체크리스트는 아직은 안 되는 모양이군요.
다운로드
- 홈페이지의 다운로드 페이지를 참고해주세요.
