티스토리에서 source code에 syntax highlight 기능 사용하기

invalid-file

티스토리에 source code를 올릴 일이 많은 사람이라면
구글 syntaxhilighter를 사용해보자.

http://code.google.com/p/syntaxhighlighter/ 사이트에서
SyntaxHighlighter_1.5.1.rar를 받은 다음 아무 디렉토리에나 압축을 풀어 놓자.
이중에서 Scripts 폴더와 Styles 폴더에 있는 파일을
티스토리 관리자 모드의 스킨 직접 올리기에서 파일 업로드 해준다.
(/images/ 디렉토리 아래에 올라간 것을 확인한 다음)

skin.html 편집에서
<link type="text/css" rel="stylesheet" href="./images/SyntaxHighlighter.css"></link>
를 추가해준다 (최상단에 link 많이 있는곳에다가)

그리고 skin.html 최하단의
</body>
</html>
바로 위에다가

<!-- google code for syntaxhighlight -->
<script class="javascript" src="./images/shCore.js"></script>
<script class="javascript" src="./images/shBrushCpp.js"></script> 
<script class="javascript"> 
dp.SyntaxHighlighter.ClipboardSwf = './images/clipboard.swf';   
dp.SyntaxHighlighter.HighlightAll('code'); 
</script> 
<!-- google code for syntaxhighlight -->

이 부분을 복사해서 넣은 다음,

이제 글쓰기로 가서
html 모드로 자동 줄바꿈을 해제한 상태에서

<textarea name="code" class="c++">
</textarea>

위의 태그 사이에다 원하는 소스 코드를 추가하면 된다.

/* HelloWorld2.cpp Standard Sytle Hello World!! */ #include <iostream> int main(void) { std::cout<<"Hello World!!"<<std::endl; std::cout<<"Hello "<<"World!!"<<std::endl; std::cout<<1<<'a'<<"String"<<std::endl; return 0; }