336x280(권장), 300x250(권장), 250x250, 200x200 크기의 광고 코드만 넣을 수 있습니다.

출처 : http://ggons.tistory.com/35



1. js 및 css 다운로드

 - http://alexgorbatchev.com/SyntaxHighlighter/download/ 에서 zip 파일 내려받기

syntaxhighlighter_3.0.83.zip


 - 임의의 폴더에 압축 해제시켜 놓습니다.


2. js 및 css 등록

 - Admin → 꾸미기 → HTML/CSS 편집
 - "파입업로드" 탭에서 위에서 압축해제한 파일 중 scripts, styles 폴더의 모든 js 및 css를 업로드 합니다.

몇년을 귀차니즘으로 버티다가 기어이 "소스코드 문법 강조 스타일"을 적용해본다. 짜잉나는 네이버 블로그를 떠난 이유도 이런 자유도 때문이 아닐까 한다.

3. skin.html 수정

 - HTML/CSS 탭 내의 skin.html 내용중 Head 태그내에 아래를 붙여넣음
 - Required 주석이 붙은 것은 반드시 붙여넣어야 하고..
 - Optional 붙은 주석은 이름을 잘 보고 쓰고 싶은 것만 넣으면 됩니다.

<!-- Required including -->
<script type="text/javascript" src="./images/shCore.js"></script>
<link rel="stylesheet" type="text/css" href="./images/shCore.css" />
<link rel="stylesheet" type="text/css" href="./images/shThemeDefault.css" />

<!-- Optional including -->
<script type="text/javascript" src="./images/shBrushAppleScript.js"></script>
<script type="text/javascript" src="./images/shBrushAS3.js"></script>
<script type="text/javascript" src="./images/shBrushBash.js"></script>
<script type="text/javascript" src="./images/shBrushColdFusion.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/shBrushErlang.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/shBrushJavaFX.js"></script>
<script type="text/javascript" src="./images/shBrushJScript.js"></script>
<script type="text/javascript" src="./images/shBrushPerl.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/shBrushPowerShell.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/shBrushSass.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>

<!-- Required including -->
<script type="text/javascript">
    SyntaxHighlighter.all();
</script>


4. 소스코드 작성

 - 에디터 우측상단 html 체크박스 체크 후 HTML 수정모드로 진입하여
 - 아래처럼 pre 태그 내에 소스코드를 써주면 됩니다.

1
2
3
4
<pre class="brush:java">public class A {
 
}
</pre>

5. 테스트 결과

1
2
3
public class A {
 
}


6. 사용 가능한 brush 목록

 - http://alexgorbatchev.com/SyntaxHighlighter/manual/brushes 참조

Brush nameBrush aliasesFile name
ActionScript3as3, actionscript3shBrushAS3.js
Bash/shellbash, shellshBrushBash.js
ColdFusioncf, coldfusionshBrushColdFusion.js
C#c-sharp, csharpshBrushCSharp.js
C++cpp, cshBrushCpp.js
CSScssshBrushCss.js
Delphidelphi, pas, pascalshBrushDelphi.js
Diffdiff, patchshBrushDiff.js
Erlangerl, erlangshBrushErlang.js
GroovygroovyshBrushGroovy.js
JavaScriptjs, jscript, javascriptshBrushJScript.js
JavajavashBrushJava.js
JavaFXjfx, javafxshBrushJavaFX.js
Perlperl, plshBrushPerl.js
PHPphpshBrushPhp.js
Plain Textplain, textshBrushPlain.js
PowerShellps, powershellshBrushPowerShell.js
Pythonpy, pythonshBrushPython.js
Rubyrails, ror, rubyshBrushRuby.js
ScalascalashBrushScala.js
SQLsqlshBrushSql.js
Visual Basicvb, vbnetshBrushVb.js
XMLxml, xhtml, xslt, html, xhtmlshBrushXml.js

'Programming > JAVA,JSP' 카테고리의 다른 글

JAVA MYSQL 활용 1  (0) 2013.04.27
JAVA MYSQL Test  (0) 2013.04.27
restlet download restlet-jse-2.1.2  (0) 2013.04.27
RESTLET Point  (0) 2013.04.21
RESTlet HelloWorld  (0) 2013.04.21