티스토리에 마크다운 적용하기2

개요

티스토리에 마크다운 적용하기1편: http://dailydev.tistory.com/17

1편에 이어서

또 다른 방법으로 마크다운을 적용하는 방법을 알아보겠습니다.

참고로, 지금 보고있는 이 글이 이렇게 작성되었습니다

STEP 1. atom 설치

필자의 경우 atom 에디터를 사용하여 마크다운을 작성합니다.
atom 에디터 공식홈페이지 : https://atom.io/

STEP 2. 패키지 설치

설치가 완료되면 마크다운 전용 패키지를 설치할 겁니다.

atom 을 실행한 후 control + ,(콤마) 를 누르면 Settings 가 나옵니다

그 후 아래 스크린샷처럼 install 에 들어간 후 markdown-preview 를 검색합니다.

스크린샷1

지금 이 글도 atom 으로 작성하는데 저는 개인적으로 markdown-preview-enchanced 가 마음에 들어서 선택하였습니다.

설치하게되면 자동으로 적용됩니다.

control + shift + m 을 누르면 오른쪽 화면에 preview 화면이 나타나게됩니다

설치 후 패키지 세팅에 들어가서 USE GitHub.com style 를 선택하면 필자와 같이 하얀 배경으로 작성됩니다.

STEP 3. 글 작성

마크다운 작성은 문법에 맞게 작성합니다.

github guides : https://guides.github.com/features/mastering-markdown/
개인적으로는 이 사이트가 가장 완벽하게 설명하고 있다고 생각하지만 영어라서 불편하시다면

간단하게나마 다음 게시물을 보고 작성합니다.
https://gist.github.com/ihoneymon/652be052a0727ad59601

STEP 4. 게시글 업로드

마지막 단계입니다.
모든 글을 작성 완료했으면

  1. md 확장자로 저장합니다.

  2. 다음 이미지와 같이 atom 우측 preview 화면에서 우클릭 한후 Open in Browser 를 선택합니다.
    스크린샷2

  1. 브라우저가 열리면 다음과 같이 아무데서나 우클릭 한 후 소스보기를 누릅니다.
    스크린샷3

  2. 소스를 전체 복사한 후 다음의 티스토리 글쓰기 페이지에서 우측 상단에 HTML 을 체크합니다.
    스크린샷4

  3. 체크 한 후 아까 복사한 소스를 붙여넣고 글쓰면 완료!

'개발 > css3' 카테고리의 다른 글

티스토리에 마크다운 적용하기  (0) 2016.12.04

+ Recent posts