본문 바로가기
블로그 이야기/티스토리 집짓기

티스토리 글쓰기 포맷 마크다운에 대해서 알아보자

by MinorityOpinion 2019. 8. 26.
728x90

저 같은 경우는 글쓰기를 하다 보면 HTML로 하는게 편한 것이 있어서 기본모드와 HTML모드를 왔다 갔다 하는 편입니다.

 

그런데 중간에 '마크다운'이라고 다른 형식이 있습니다.

 

한번 눌러보면

 

 

 

오히려 일부 기능을 지원하지 않는 다는 말과 함께

 

 

기본 모드에서 사용 할 수 있는 기능은 싹다 막아버리고 달랑 제목과 본문 내용만 적을 수 있게 되어 있습니다.

 

처음에는 뭐가 뭔지 모르니 안쓰게 되는 기능인데, 저도 안지 얼마 되지 않아서 한번 소개 해볼려고 합니다.

 

마크다운은 “존 그루버” 라는 분에 의해 만들어진 텍스트 기반의 마크업 언어로, 쓰기 쉽고 읽기 쉬운 문서를 편하게 작성할 수 있는 방법입니다. 마크다운 언어가 개발자 커뮤니티에서 확산되게 된 계기는 GitHub 리포지토리에 README.md 파일을 사용해 프로젝트 문서를 생성하게 되면서 부터입니다. GitHub에서는 기존의 마크다운 문법에서 조금 더 개선된 GFM(Github Flavored Markdown) 이라는 문법을 사용하며, 현재는 GFM 문법이 가장 폭넓게 사용되고 있습니다.

기존에 방법으로는 드래그하고 지정을 하고 마우스를 계속해서 써야 했다면

 

마크다운은 키보드만으로 모든 것을 할 수 있습니다.

 

이런 마크다운 형식은 모바일 환경에서도 편한데, 좁은 스마트폰에서는 아이콘이 나열된 에디터에서는 일일이 터치하기가 많이 불편하지요, 덕분에 다른 스마트폰용 마크다운 글쓰기 도구도 등장 했다고 합니다.

 

 

헤더 타이틀 제목을 지정해주기 위해서는 드래그나 해당하는 글을 체크를 하고 

 

마우스를 위로 가져가서 선택을 해야 합니다.

 

하지만 마크다운에서는 간단하게 #의 개수만으로 이를 설정 할 수 있습니다. 1~6까지를 지원합니다.

 

마크다운 표기

실제 화면에 나타나는 크기

 

이렇게 많이 쓰이는 마크다운 문법을 알아보겠습니다.

 

#은 최대 6개 까지이고 더 쓴다고해서 작아지지는 않습니다. 그리고 #뒤에 한칸 띄워셔야 합니다.

 

1. 굵은 글씨, 기울기, 취소선

 

 

굵은 글씨는 양 옆에 ** 두번

기울기 는 _ 또는 * 한번씩

취소선은 ~ 입니다.

 

 

두개 이상의 기능을 중복해서 사용이 가능합니다.

 

2. 인용문

> 넣고 글을 쓰면 됩니다

 

>는 중복으로사용 가능합니다.

이렇게 인용구 안에 인용구가 들어갑니다.

 

3.  코드 인용 및 코드펜스

코드 인용은 양끝에 백틱(backtick) ' 를 3번식 넣어주시면 됩니다.

 

백틱이 시작하는 부분에 지원하는 프로그래밍 언어 이름을 적어주면 문법 하이라이팅도 가능합니다.

 

4. 링크

대괄호 안에 링크가 되고 싶은 단어를 입력하고 바로 이어서 소괄호안에 해당하는 링크를 적으시면 됩니다.

 

링크와 이름이 일치하는 경우 대괄호만 적어주시면 됩니다.

 

5. 참조링크/반복되는 링크

링크가 반복되서 나올 경우 바로 지정을 해주지 않고 임의의 문자로 지정을 해준다음

마지막에 대괄호로 임의의 문자를 재지정 해주면 마찬가지로 연결이 됩니다.

 

6. 이미지 링크 걸기

링크걸기와 똑같습니다. 딱 하나 다른게 있는데 시작할때 ! 느낌표를 넣어주셔야 합니다.

 

 

7. 리스트 만들기

 

대시와 공백을 이용하면 리스트를 만들 수 있습니다.

 

8. 이모지 생성하기

 

https://www.webfx.com/tools/emoji-cheat-sheet/

 

Emoji cheat sheet for GitHub, Basecamp and other services

Emoji codes used by GitHub, Basecamp, Slack and other services. Searchable. With emoji meanings.

www.webfx.com

마크다운으로 이모지, 이모티콘도 여러가지 만들 수가 있습니다. 그런데 제가 잘못한건지 표시가 잘 안되어서 따로 적지는 않겠습니다.

 

9. 라인 구분선

 

 

대시를 3번 이상 적으시면, 구분선으로 나옵니다

 

 

10. 무시하기

양옆에 *를 두면 변형이 되는데 이를 원하지 않는다면 원화표시 \(역슬레시)를 두시면 됩니다.

 

 

마크다운은 깃허브, 아톰, VS Code등 개발도구에서도 사용하며

Bear등 스마트폰용 글쓰기 도구, 워드프레스 플러그인 Typora, StackEditor와 같은 데스크탑 및 웹브라우저 환경 글쓰기 도구등 많은 곳에서 사용 할 수 있습니다.

 

 

지금까지 배운 기능들을 개별적인 것이 아니고 중복해서 사용이 가능합니다

 

인용구 + 굵게 + 기울기 + 취소선

 

 

 

 

 

 

 

 

최근에 에디터가 개편이 되고 나서 불편함을 토로하시는 분들이 많은 것으로 아는데 이는 점점 표준으로 되어가고 있는 마크다운 형식을 티스토리식으로 해석한 것이다보니 글자크기의 개별 pt수정 불가능등 이전과 다른 모습을 보이는 걸로 보입니다.

 

여담으로 유튜브 덧글에서도 지원하는 방식입니다.

 

글 양끝에 - 대시를 넣어주면

 

 

이렇게 취소선이 그이는 것을 볼 수 있습니다.

 

저도 사실 유튜브에서 이런 덧글 보고 신기헤서 찾아봤습니다.

728x90