오늘은 어디로 갈까...

SyntaxHighlighter 적용하기 본문

井底之蛙

SyntaxHighlighter 적용하기

剛宇 2009. 2. 17. 17:56
SyntaxHighlighter는 자바스크립트 기반으로 만들어졌는데, 코드(code)등을 포스팅할때 쉽고(?) 이쁘게(?) 해주는 역할을 한다.


* 코드 삽입 방법
<pre class="brush: js">
	alert("Hello world");
</pre>


* 사용 방법
 - 해당 사이트에 업로드에서 사용해도 되지만, 귀찮으면 http://alexgorbatchev.com 에서 제공해주는 주소를 그냥 사용 가능하다.
 - 필요한 부분만 넣어도 되지만, 귀찮으면 다 넣어버리자.
<head>
	<script type="text/javascript" src="http://alexgorbatchev.com/pub/sh/2.0.278/scripts/shCore.js"></script>
	<script type="text/javascript" src="http://alexgorbatchev.com/pub/sh/2.0.278/scripts/shBrushBash.js"></script>
	<script type="text/javascript" src="http://alexgorbatchev.com/pub/sh/2.0.278/scripts/shBrushCpp.js"></script>
	<script type="text/javascript" src="http://alexgorbatchev.com/pub/sh/2.0.278/scripts/shBrushCSharp.js"></script>
	<script type="text/javascript" src="http://alexgorbatchev.com/pub/sh/2.0.278/scripts/shBrushCss.js"></script>
	<script type="text/javascript" src="http://alexgorbatchev.com/pub/sh/2.0.278/scripts/shBrushDelphi.js"></script>
	<script type="text/javascript" src="http://alexgorbatchev.com/pub/sh/2.0.278/scripts/shBrushDiff.js"></script>
	<script type="text/javascript" src="http://alexgorbatchev.com/pub/sh/2.0.278/scripts/shBrushGroovy.js"></script>
	<script type="text/javascript" src="http://alexgorbatchev.com/pub/sh/2.0.278/scripts/shBrushJava.js"></script>
	<script type="text/javascript" src="http://alexgorbatchev.com/pub/sh/2.0.278/scripts/shBrushJScript.js"></script>
	<script type="text/javascript" src="http://alexgorbatchev.com/pub/sh/2.0.278/scripts/shBrushPhp.js"></script>
	<script type="text/javascript" src="http://alexgorbatchev.com/pub/sh/2.0.278/scripts/shBrushPlain.js"></script>
	<script type="text/javascript" src="http://alexgorbatchev.com/pub/sh/2.0.278/scripts/shBrushPython.js"></script>
	<script type="text/javascript" src="http://alexgorbatchev.com/pub/sh/2.0.278/scripts/shBrushRuby.js"></script>
	<script type="text/javascript" src="http://alexgorbatchev.com/pub/sh/2.0.278/scripts/shBrushScala.js"></script>
	<script type="text/javascript" src="http://alexgorbatchev.com/pub/sh/2.0.278/scripts/shBrushSql.js"></script>
	<script type="text/javascript" src="http://alexgorbatchev.com/pub/sh/2.0.278/scripts/shBrushVb.js"></script>
	<script type="text/javascript" src="http://alexgorbatchev.com/pub/sh/2.0.278/scripts/shBrushXml.js"></script>
	<link type="text/css" rel="stylesheet" href="http://alexgorbatchev.com/pub/sh/2.0.278/styles/shCore.css"/>
	<link type="text/css" rel="stylesheet" href="http://alexgorbatchev.com/pub/sh/2.0.278/styles/shThemeDefault.css"/>
	<script type="text/javascript">
		SyntaxHighlighter.all();
	</script>
</head>


* 다운로드
http://code.google.com/p/syntaxhighlighter/
http://alexgorbatchev.com/wiki/

* Brushes

Brush name Brush aliases File name
Bash/shell bash, shell shBrushBash.js
C# c-sharp, csharp shBrushCSharp.js
C++ cpp, c shBrushCpp.js
CSS css shBrushCss.js
Delphi delphi, pas, pascal shBrushDelphi.js
Diff diff, patch shBrushDiff.js
Groovy groovy shBrushGroovy.js
JavaScript js, jscript, javascript shBrushJScript.js
Java java shBrushJava.js
PHP php shBrushPhp.js
Plain Text plain, text shBrushPlain.js
Python py, python shBrushPython.js
Ruby rails, ror, ruby shBrushRuby.js
SQL sql shBrushSql.js
Visual Basic vb, vbnet shBrushVb.js
XML xml, xhtml, xslt, html, xhtml shBrushXml.js
'井底之蛙' Related Articles more