물론 보기에는 좋았지만, 이 preetyPrint 라는 것은 소스를 복사해 쓰기에는 좋지 않았는데...
텍스트를 선택해서 복사하면 엔터키가 제대로 안먹히는 문제가 있었다.
그래서 찾아 본것이, "SyntaxHighlighter" !!
http://alexgorbatchev.com/SyntaxHighlighter/
이게 가장 흔히 사용되는 듯하다.
적용하는 법은 간단하지만, 문제는 최신 버젼을 적용할 경우 아무리 해도 클릭시 소스코드를 복사 할수 있는 팝업이 뜨지 않는다.
결국 해당 기능이 동작하는 다른 사이트를 참고해서 하위 버젼을 적용할 수 밖에 없었다. (ㅜ.ㅜ)
적용하는 법은 템플릿에서 </body> 태그 바로 앞에...
를 추가하고.
<pre class="brush: js"> /** * SyntaxHighlighter */ function foo() { if (counter <= 10) return; // it works! } </pre>
글을 쓸때 이렇게 쓰면 된다.
이제 해당 소스 위에 마우스를 올리면 툴바가 오른쪽 상단에 나타나고, 소스버튼을 클릭하면 새창이 뜨면서 소스를 복사할 수 있는 별도의 창이 뜬다.
어째서 인지는 모르지만 최신 버젼은 툴바를 제대로 지원하지 않는다.
디자인은 preetyPrint 쪽이 맘에 들지만...
뭐 어쩔수 없지.