lonelycat's cellar

http://choboyam.tistory.com/entry/tsyntax

하는 일이 하는 일이다 보니 블로깅 중에 소스를 넣는 경우가 많은데 그냥 넣으려니 보기 싫어서 코드 형식으로 넣는 방법을 찾음.
다른 블로거들이 이쁘게 넣고 있길래 찾아보니 syntaxhighlighter 라는 것이 있었다.

까보진 않았으나 자바스크립트 플러그인? 인 듯...
특정 태그 안에 넣은 소스 코드를 찾아서 이쁘게 만들어준다.

티스토리 에디터에서는 쓰는 방법이 불편하여 좀더 찾다보니 맨위의 링크와 같은 분이 계셨음 ㅋ
관리자 > html/css 에서 첨부한 파일을 업로드하고, 스킨의 html을 수정하여 다음과 같이 추가

###html
<script type="text/javascript"  src="http:./images/tsyntax.js">
</script>

원저자분은 구글 코드에 올려놓으셔서 src="http://tsyntax.googlecode.com/hg/release/tsyntax.js" 이렇게 링크를 걸어도 되나 없어질지 모르므로,
일단 원본을 업로드 후 링크.

사용법은 티스토리 에디터에서 인용구 넣은 후 소스 붙여 넣고 젤 윗 줄에 ###문법종류 추가하기

###html <script type="text/javascript"  src="http:./images/tsyntax.js"> </script>

이렇게..

원래 syntaxhighlighter에서는 pre 태그 또는 script 태그를 쓰게 되어있는데, 쵸보얌님은 인용구 태그(blockquote)를 pre 태그로 jQuery를 이용하여 변경.
월등히 쓰기 변해졌다...

참고로 문법종류는 설정으로 다음과 같다

[설정 부분] 각 설정은 ";"를 사용하여 구분하여 복수의 기능을 나열하여 사용할 수 있습니다, syntaxhighlighter의 class에서 적는 것과 같습니다. 반드시 시작의 첫 행으로 인식하며, 편의상 brush 부분을 생략하였습니다. 언어 선택(필수) : ### 이후 처음으로 적을 내용 자바스크립트 : js (또는 jscript, javascript) CSS : css HTML : html, xhtml XML : xml, xslt PHP : php JAVA : java PEARL : pearl, pl PYTHON : py, python C++ : cpp, c RUBY : rails, ror, ruby BASH/SHELL : bash, shell 텍스트 문서 : plain, text ... html-script: true; css, script 및 php 등 html과 같이 사용되어지는 한 문서에서 모두 구문강조 시킬때 사용합니다. gutter: false; 행번호 출력을 삭제합니다. first-line: 150; 첫 행의 번호를 150행부터 시작합니다. auto-links: false; 문서에 있는 링크를 자동으로 거는 것을 막습니다. highlight: [2, 4, 6] 2,4,6행을 강조합니다.

ps. 쵸보얌님의 항의가 있을 경우 삭제하겠습니다...

수정)
- tsyntax.js 파일 내에서 xScript("http://tsyntax.googlecode.com/hg/release/hooker.js"); 와 같이 링크하는 게 있어서 업로드한 파일을 직접 링크하게 xScript("shHooker.js"); 이렇게 수정하였으나, 티스토리 서버에 캐쉬로 원본 파일이 남아서 그런지 제대로 반영이 안됨.
- 그냥 스킨 html 수정해서 둘 다 링크했음. 파일명도 찾기 좋게 변경.

###html
<script type="text/javascript"  src="http:./images/tsyntax.js"></script>
<script type="text/javascript"  src="http:./images/hooker.js"></script>