티스토리 SyntaxHighlighter 테마 적용 하기 (소스 코드 색넣기)

티스토리에 SyntaxHighlighter 적용하는 방법 : http://hijuworld.tistory.com/25

SyntaxHighlighter 에 다양한 테마를 적용 시켜보자.

우선 블로그 관리에가서 스킨 편집을 누르자.

그리고 html 편집을 누르자.

아래 그림에 보면 지난번 SyntaxHighlighter 를 업로드 할때 추가한 html 코드가 보인다.

빨간줄이 가있는 shThemeDefault.css가 티폴트 테마이다.

이것을 변경하면 테마를 편경 할 수 있다.

테마 이름	CSS 이름
Default	shThemeDefault.css
Django	shThemeDjango.css
Eclipse	shThemeEclipse.css
Emacs	shThemeEmacs.css
Fade To Grey	shThemeFadeToGrey.css
Midnight	shThemeMidnight.css
RDark	shThemeRDark.css

위에 테마에 맞춰서 shThemeDefault.css를 다른 것 으로 바꿔주면 된다.

나는 shThemeDefault.css를 shThemeRDark.css 로 변경 하였다.

아래 적용하기전에 코드

아래 적용 후에 코드 이다.

각 테마별로 어떻게 변하는지 공식 사이트에서 캡쳐해왔다.

1. 테마 이름 : Default 

shThemeDefault.css 

---

2. 테마 이름 : Django 

shThemeDjango.css

---

3. 테마이름 : Eclipse 

shThemeEclipse.css

---

4. 테마 이름 : Emacs 

shThemeEmacs.css

---

5. 테마 이름 : Fade To Grey 

shThemeFadeToGrey.css 

---

6. 테마 이름 : Midnight 

shThemeMidnight.css 

---

7. 테마 이름 : RDark 

shThemeRDark.css

---

Brush name	Brush aliases	File name
ActionScript3	as3, actionscript3	shBrushAS3.js
Bash/shell	bash, shell	shBrushBash.js
ColdFusion	cf, coldfusion	shBrushColdFusion.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
Erlang	erl, erlang	shBrushErlang.js
Groovy	groovy	shBrushGroovy.js
JavaScript	js, jscript, javascript	shBrushJScript.js
Java	java	shBrushJava.js
JavaFX	jfx, javafx	shBrushJavaFX.js
Perl	perl, pl	shBrushPerl.js
PHP	php	shBrushPhp.js
Plain Text	plain, text	shBrushPlain.js
PowerShell	ps, powershell	shBrushPowerShell.js
Python	py, python	shBrushPython.js
Ruby	rails, ror, ruby	shBrushRuby.js
Scala	scala	shBrushScala.js
SQL	sql	shBrushSql.js
Visual Basic	vb, vbnet	shBrushVb.js
XML	xml, xhtml, xslt, html, xhtml	shBrushXml.js