티스토리 마크다운(Markdown) 사용방법

markdown.css markdown.js

티스토리 마크다운(Markdown) 사용방법

글쓰기에서 HTML모드 선택 후 textarea 태그를 사용하여 그 안에 마크다운 문서를 작성하면 위에 첨부된 마크다운 js/css 파일에서 다시 렌더링 해주는 형식으로 사용한다.

1. 관리페이지의 좌측메뉴에 스킨편집을 선택

2. 우측에 HTML편집 선택

3. 우측 파일업로드 탭에서 위의 파일을 하단의 추가 메뉴를 선택하여 업로드 한다.

4. HTML 탭에서 하기 그림과 같이 코드를 입력한다.

```

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.2.4/jquery.min.js"></script>

```

위의 내용을 입력 후 가장 마지막으로 이동하여 하기의 그림과 같이 2개의 코드를 추가한다.

```

<link rel="stylesheet" href="./images/markdown.css">

<script src="../images/markdown.js"></script>

```

```

<script>

    $('textarea[markdown]').each(function (i) {

        var text = $(this).val();

        var html = marked(text, {

            gfm: true,

            tables: true,

            breaks: false,

            pedantic: false,

            sanitize: false,

            smartLists: true,

            smartypants: false

        });

        $(this).before('<div class="markdown-body">' + html + '</div>');

    });

</script>

```


5. 마지막으로 CSS 탭을 선택 후 아래 내용을 입력한다.

```

textarea[markdown] {

    display:none;

}

```


* 사용방법

</textarea><textarea markdown="">

# Title 1

## Sub Ttile

# Title 2

</textarea>