기존의 나의 티스토리 포스팅의 경우

위와 같이 가독성이 떨어지는 텍스트 형식의 설명으로 되어있었다.

이제 아래와 같이 매우 보기 좋게 출력이 되어 사람들이 보기 편하도록 변경되었음을 알 수 있다.

티스토리 소스코드 예쁘게 출력하기

http://alexgorbatchev.com/SyntaxHighlighter/download/

나는 SyntaxHighlighter 라는 것을 사용하기로 했다

다른 블로그를 검색해보니 대부분이 이것을 사용하였다.

다운을 받고 압축을 풀면 위와 같이 나타난다.

너무 복잡하지 않은가?

다 필요없고 scripts 폴더와 styles 폴더를 티스토리에 업로드한다.

파일 업로드는 관리자 페이지에서 HTML/CSS편집 ->  파일업로드 하면된다.

<script type="text/javascript" src="./images/shCore.js"></script>

<script type="text/javascript" src="./images/shLegacy.js"></script>

<script type="text/javascript" src="./images/shBrushBash.js"></script>

<script type="text/javascript" src="./images/shBrushCpp.js"></script>

<script type="text/javascript" src="./images/shBrushCSharp.js"></script>

<script type="text/javascript" src="./images/shBrushCss.js"></script>

<script type="text/javascript" src="./images/shBrushDelphi.js"></script>

<script type="text/javascript" src="./images/shBrushDiff.js"></script>

<script type="text/javascript" src="./images/shBrushGroovy.js"></script>

<script type="text/javascript" src="./images/shBrushJava.js"></script>

<script type="text/javascript" src="./images/shBrushJScript.js"></script>

<script type="text/javascript" src="./images/shBrushPhp.js"></script>

<script type="text/javascript" src="./images/shBrushPython.js"></script>

<script type="text/javascript" src="./images/shBrushSql.js"></script>

<script type="text/javascript" src="./images/shBrushXml.js"></script>

<script type="text/javascript" src="./images/shBrushVb.js"></script>

<link rel="stylesheet" type="text/css" href="./images/shCore.css">

<link rel="stylesheet" type="text/css" href="./images/shThemeDefault.css">

<script type="text/javascript">

SyntaxHighlighter.all();

</script>

이제 글을 작성 할때 적용하는 일만 남았다.

pre , textarea 태그 중 하나를 사용하면 된다.

포스팅시 우측상단 HTML 체크바를 선택해준후

main 함수를 열어보니

<textarea name="code" class="brush:c;">

#include <stdio.h>

#include "stm32f10x.h"

</textarea>

이것을 입력해준다..