본문 바로가기

프로그램 경험/프로그램 정보

SyntaxHighlighter 사용하기


아래 사이트에서 파일을 다운받는다.
http://alexgorbatchev.com/wiki/SyntaxHighlighter

압축을 풀면 3개 폴더가 있는데 그중에서 scripts 폴더와 styles 폴더에 있는 모든 파일들을

Tistory >> 스킨 >> HTML/CSS편집 메뉴의 파일 업로드 탭에서 파일을 업로드 한다.




업로드가 끝났으면 이번엔 HTML/CSS편집 탭으로 가서 skin.html 파일 내용중 </head> 바로 윗부분에 아래의 내용을 추가한다.


 <script type="text/javascript" src="./images/shCore.js"></script>
 <script type="text/javascript" src="./images/shBrushBash.js"></script>
 <script type="text/javascript" src="./images/shBrushCpp.js"></script>
 <script type="text/javascript" src="./images/shBrushCSharp.js"></script>
 <script type="text/javascript" src="./images/shBrushCss.js"></script>
 <script type="text/javascript" src="./images/shBrushDelphi.js"></script>
 <script type="text/javascript" src="./images/shBrushDiff.js"></script>
 <script type="text/javascript" src="./images/shBrushGroovy.js"></script>
 <script type="text/javascript" src="./images/shBrushJava.js"></script>
 <script type="text/javascript" src="./images/shBrushJScript.js"></script>
 <script type="text/javascript" src="./images/shBrushPhp.js"></script>
 <script type="text/javascript" src="./images/shBrushPlain.js"></script>
 <script type="text/javascript" src="./images/shBrushPython.js"></script>
 <script type="text/javascript" src="./images/shBrushRuby.js"></script>
 <script type="text/javascript" src="./images/shBrushScala.js"></script>
 <script type="text/javascript" src="./images/shBrushSql.js"></script>
 <script type="text/javascript" src="./images/shBrushVb.js"></script>
 <script type="text/javascript" src="./images/shBrushXml.js"></script>

 <link type="text/css" rel="stylesheet" href="./images/shCore.css"/>
 <link type="text/css" rel="stylesheet" href="./images/shThemeDjango.css"/>


 <script type="text/javascript">
  SyntaxHighlighter.config.clipboardSwf = './images/clipboard.swf';
  SyntaxHighlighter.all();
 </script>


그리고 사용할때는 아래와 같이 사용하면 된다.

<PRE class="brush: c-sharp;">
   소스 내용~
</PRE>