카테고리 없음

SyntaxHighLighter setup

Soul-Learner 2014. 8. 7. 16:08

티스토리 블로그에 SyntaxHighLighter 적용하여 코드 줄번호 나타내기



1. 다운로드 및 압축해제

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

syntaxhighlighter_3.0.83.zip



2. 티스토리 스킨편집 > 파일 업로드

 - scripts, style 폴더에 있는 모든 파일을 선택해서 티스토리에 업로드한다



3. 스킨편집

 - HTML/CSS 탭을 눌러서 다음 <head> ~ </head> 사이에 다음과 같은 코드를 붙여넣는다

<!--SyntaxHighlighter setup start-->
<script type="text/javascript" src="./images/shCore.js"></script>
<script type="text/javascript" src="./images/shBrushAS3.js"></script>
<script type="text/javascript" src="./images/shBrushCpp.js"></script> 
<script type="text/javascript" src="./images/shBrushCss.js"></script>
<script type="text/javascript" src="./images/shBrushDiff.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/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/shBrushPython.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>
<script type="text/javascript" src="./images/shLegacy.js"></script>
<link href="./images/shCore.css" rel="stylesheet" type="text/css">
<link href="./images/shCoreDefault.css" rel="stylesheet" type="text/css">
<script type="text/javascript">
     SyntaxHighlighter.all();
</script>
<!--SyntaxHighlighter setup end-->



4. 사용법

<pre class="brush : html">

    작성하는 글

     ............

</pre>



5. 언어의 이름은 다음 중에서 선택하여 적용하면 된다

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




저작자표시 (새창열림)