IT와 tech ・2021. 2. 7.

티스토리 마크다운 문법 사용 방법 배우기 (에디터 전용 프로그램)

티스토리 구 에디터가 종료가 되어 신에디터로 글 쓰는 것에 적응하는 중입니다. 마크다운 문법을 알아두면 신규 에디터에서 글 작성하는 것이 좀 더 손 쉬울 것 같아 배워두려고 합니다.

신규 에디터의 아쉬운 점은 여러가지 있는데, 몇가지 정리하면 다음과 같습니다.

  • 메모장같이 별도의 문서 파일에서 글을 작성한 후 복사 붙여넣기할 때 불편함

    • 링크 코드가 들어간 글은 제대로 복사 되지 않음

    • 메모장에서 복사한 글은 단어 띄어 쓰기 부분에 &nbsp 문구가 사이에 자동 생성되어 html이 지저분해짐

    • html 코드가 날아가는 경우 발생 (예: 애드센스 코드)

  • 표 작성이 불편함 (구 에디터보다 직관적이지 않음, 부분 수정이 어려움)

  • 이미지 첨부, 일괄 수정이 불편함 (워터마크 제작 등의 기능이 부족)

  • 구 에디터의 글상자가 없음

  • 더보기 닫기 기능 제공하지 않음

  • 각주 기능 제공하지 않음

  • 글 태그 분류 최대 10개까지만 가능


이러한 불편함이 있기는 하지만, 현재로써는 구 에디터를 사용할 수 없는 상황이기 때문에 신 에디터로 글 작성하는 방법에 적응할 필요가 있습니다.

 

주로 메모장에 글을 작성하였다가 블로그에 글 올릴 때 html만 추가하여 글 색상을 바꾸거나 하는 식으로 작성하였는데요. 글을 복사 붙여넣기할 때 자꾸 띄어쓰기 부분에 &nbsp라는 문구가 작성되어 html모드로 들어가 글을 다시 전체 복사한 후 메모장에서 &nbsp를 전부 띄워쓰기로 모두 바꾸기를 사용하여 다시 복사한 후 글을 업로드하고 있습니다.

요약하면, 기존에는 메모장→티스토리 html 추가 수정 →업로드 이렇게하여 글을 올렸었다면

신 에디터로는 메모장→티스토리 html모드 글 복사→메모장으로 다시 글 복사→&nbsp전부 삭제→티스토리 html 모드에 붙여넣기→티스토리 html 추가 수정 업로드 이러한 과정을 거치게 되는데요.

과정이 길어진만큼 피로도가 쌓여 다른 방법으로 마크다운 문법을 익히는 것이 대안이 될 수 있을 것 같아 자주 사용하는 html을 마크다운으로는 어떻게 표기하는지 한번 정리해보았습니다.

마크다운이란 무엇인가 문법 정리

위키에 따르면 텍스트를 HTML로 쉽게 변환 시키는 문법을 말합니다. 마크업의 일종으로 HTML 태그를 반복적으로 사용하는 부분을 사용하기 쉬운 텍스트 포맷으로 XHTML이나 HTML으로 변환하는 것인데요. 존 그루버와 아론 스워츠가 만들었습니다.

티스토리에서도 마크다운을 지원하며, 그 밖에 마크다운 문법이 적용되는 곳으로 레딧, GitHub, Trello, jekyll, 디스코드 등이 있습니다.

메모장부터 마크다운 전용 에디터 프로그램까지 사용 가능합니다. 마크다운 문법은 지원하는 곳의 CSS의 영향을 받기 때문에 CSS 설정도 중요한 것으로 보입니다.

개인적으로 자주 사용하는 HTML을 위주로 정리해보았습니다.

제목 태그 H1, H2, H3, H4, H5, H6 사용방법

# 제목1
## 제목2
### 제목3
#### 제목4
##### 제목5
###### 제목6

▲ 마크다운 h2 적용

제목을 H2 태그를 사용하여 강조하고 싶다면 위와 같이 ##으로 표시한 뒤 제목 내용을 작성하면 됩니다. #의 숫자만큼 h1, h2, h3 태그를 6까지 사용할 수 있습니다.

밑줄, 강조, 이텔릭체, 취소선 표현

▲ 마크다운 강조문

이텔릭 또는 이텔릭
굵게 표시 또는 굵게 표시

취소선

밑줄

 

위와 같이 표시가 됩니다.

이텔릭체와 굵게 표시의 차이는 _의 갯수가 1개와 2개 차이입니다. _ 대신 * 표시를 사용할 수도 있습니다.

 

목록 목차 만들기 마크다운

목차 만드는 것은 html에서는 ul태그와 ol 태그를 이용하여 시작하고 <li></li>을 이용하여 작성합니다. 꽤 귀찮은 작업인데, 목록도 손쉽게 마크다운으로 만들 수 있습니다.

 

먼저 순서 없이 목록 리스트를 만든다면

 

-, *, + 3가지 표시로 표현할 수 있습니다.

 

목차 안에 소분류로 목차를 사용할 때는 띄워쓰기로 한칸 넣어서 작성하면 됩니다.

▲ 마크다운 목록 적용 예시

숫자로 표기하고 싶다면, 숫자로 작성하시면 됩니다.

인용글 적용하기


<blockquote> 태그를 적용하는 방법은 간단합니다.

 

>인용문
>인용문
>인용문


링크와 이미지, 표 넣는 것은 티스토리 에디터에서 직접 할 것이라 굳이 정리하지 않았습니다.

간단한 기초적인 마크다운 문법에 대해서 정리해보았는데요. 메모장을 이용하여 글을 작성하신다면 위와 같은 마크업으로 글을 작성한 뒤 티스토리 에디터에서 [마크다운]으로 설정한 뒤 복사 붙여넣기하여 정리하는 것이 가장 글 작성 시간을 절약하는 방법이 될 것으로 기대하고 있습니다.

마크다운 문법을 사용하여 글을 작성하였을 때 결과물을 바로 출력하여 확인해보고 싶으시다면, 전용 에디터를 사용하는 것도 방법입니다. 타이포라(Typora)는 무료 에디터가 있습니다. 주로 메모장으로 글을 작성해왔었는데 해당 프로그램을 한번 사용해보려고 합니다.

타이포라

타이포라는 공식 홈페이지에서 무료로 배포중이니 공식 사이트에서 다운받아서 설치하여 이용하실 수 있습니다.