소스코드를 웹 상에서 예쁘게 보여줄 일이 있을때 유용한 라이브러리가 있다.
바로 SyntaxHighlighter라는 것이다.
http://alexgorbatchev.com/wiki/SyntaxHighlighter
위의 URL에서 필요한 설명과 파일을 다운로드 하면 된다.
관련 파일들(js 파일과 css파일들, 그리고 swf(클립보드용 flash파일))을 다운로드해서 특정 위치에 넣어 놓고,
아래와 같이 소스에 추가하면 된다.
<script type="text/javascript" src="scripts/shCore.js"></script>
<script type="text/javascript" src="scripts/shBrushJava.js"></script>
<link type="text/css" rel="stylesheet" href="styles/shCore.css"/>
<!-- link type="text/css" rel="stylesheet" href="styles/shThemeDefault.css"/-->
<link type="text/css" rel="stylesheet" href="styles/shThemeEclipse.css"/>
<script type="text/javascript">
SyntaxHighlighter.config.clipboardSwf = 'scripts/clipboard.swf';
SyntaxHighlighter.all();
</script>
여기서 나는 eclipse 테마를 적용하기 위해서 저렇게 지정했고,
기본 테마를 쓰고 싶다면, 네번째 줄에 있는 주석을 제거하고, 그 아래줄을 주석처리하면 된다.
참고로 shCore.js 파일은 다른 js나 css보다 위에 있어야 한다.
(되도록이면 위의 순서를 따라주기 바란다.)
그리고 소스를 추가할 부분에는(Body 태그 안에는) 아래와 같이 사용하면 된다.
<pre class="brush: java">
자바 소스는 여기에...
</pre>
만약 여러분들이 개발한 사이트가 아닌,
블로그에 적용하고자 할 경우에는
http://gyuha.tistory.com/193를 참조하면 된다.
