[TSYNTAX] 초간편! 티스토리 Syntax Highlighter 적용하기!!

 

Google Syntax Highlighter

  웹서핑을 하시면서 프로그램 코드의 각 구문들이 가독성 좋게 색깔로 표현되어 있는 것을 보신 적 있으실 겁니다.
 이것이 바로 < Google Syntax Highlighter >인데, 코드를 자주 포스팅에 삽입하시는 분들께는 거의 필수입니다.
 저도 적용하는 법을 몰라서 많이 헤매었는데, 생각보다도 훨씬 간단하게 티스토리 블로그에 적용할 수 있는 방법이 있어 포스팅 합니다.

  사실, Syntax Highlighter를 티스토리에 적용하는 방법은 이미 많이 포스팅이 되어있는데요,
  검색을 해보면 대부분의 포스팅이 아래와 같은 순서를 소개하고 있습니다.

[ 기존 설치 & 적용법 ]
1. Syntax Highlighter 최신 버전을 다운
2. 티스토리에 업로드
3. 스킨에 반영

 

 그러나!! HTML/CSS 편집에서 코드 딱! 한줄만 추가하시면,
 이런 번거로운 절차 없이 바로 Google Syntax Highlighter를 적용해서 사용하실 수 있습니다.

초간단! 티스토리 Syntax Highlighter 적용법!!
1.  우선, 티스토리 블로그 관리 화면에서, [ 스킨 >> HTML/CSS 편집 ]으로 갑니다.
2.  [ skin.html ] 에서 </head> 바로 앞 부분에 아래의 코드를 삽입합니다.(저장하고 끝~ -_-)

###js
<script type="text/javascript" src="http://tsyntax.googlecode.com/hg/release/tsyntax.js"></script> 

정말 간단하죠? ㅇ_ㅇ)a

이제부터 본문글 작성하면서 인용구(Ctrl+Q)를 선택하고, 그 안에 해당 언어의 종류를 적습니다.
그리고 보여주고 싶은 코드를 Ctrl+C / Ctrl+V 하고 저장~!
그러면 아래와 같이 구문강조가 된 모습으로 블로그에 저장이 됩니다.

 

이 방법은 띵구리야님의 초보얌 블로그에 정말 깔끔하게 정리되어 있습니다.
저도 제 블로그에 적용시킬 때, 띵구리야님 블로그에서 배웠습니다. ^_^
아래 링크를 참조하세요

< 초보얌 > 블로그 by 띵구리야 님 

 http://choboyam.tistory.com/1

 
 
 

어떻게 이렇게 간단하게 되지?! 

  티스토리에서 이렇게 간단하게 한줄만 코드를 추가해서 쉽게 Syntax Highlighter를 쓸 수 있는 이유는 아래 그림처럼, 미리 단순화 작업을 해뒀기 때문입니다.

http://code.google.com/p/tsyntax/

 

  

티스토리 Syntax Highlighter의 고질적인 문제  

  문제는 티스토리의 게으름(?)으로, 많은 분들이 Syntax Highlighter를 적용시켜서 사용하실 때, 불편을 겪고 있다는 사실입니다. 대표적인 문제로는 코딩을 할 때 엔터 한번이 엔터 두번으로 인식이 된다던지, 코드를 긁어서 붙여넣었을 때 제대로 적용이 안된다는 점들이 있습니다.
 
  저도 역시, 코드를 붙여넣을 때 마다 이런 일이 발생하여 애를 먹었으나, 다행히 이제는 약간의 노하우가 생겼습니다. 

티스토리 Syntax Highlighter 문제해결 꼼수
1. 붙여넣고 싶은 코드를 메모장에 붙여 넣는다.
2. 찾아바꾸기 기능(Ctrl+H)을 이용해, </div>는 </br>로, <div>는 삭제시킨다.

  그러나, 이런 꼼수도 적용시킨 스킨에 따라 안되는 경우도 있습니다. ㅠㅠ
  조금 불편하기는 하지만, 주로 쓰는 C#과 Java 외에도  SQL, Python, PHP 등 지원하는 언어가 많기 때문에 애용하고 있습니다.
  많은 분들이 노력하고 계시므로, 곧 고수님들이 해결법을 내어 놓으실 거라 기대해봅니다. ^_^