블로그 이미지
괴스트

예진이와 고고씽!!

Rss feed Tistory
Dev/windows 2010/02/12 15:47

소스 코드 구문강조. SyntaxHighlighter 2.0.320 - 티스토리 적용기

크리에이티브 커먼즈 라이선스
Creative Commons License
1. 스킨 > HTML/CSS 편집 > skin.html 에 아래 코드를 적용
01.<head>
02....
03. 
04.<!-- SyntaxHighlighter 2.0.320 -->
05.<script type="text/javascript"
06.    src="http://alexgorbatchev.com/pub/sh/2.0.320/scripts/shCore.js"></script>
07.<script type="text/javascript"
08.    src="http://alexgorbatchev.com/pub/sh/2.0.320/scripts/shBrushBash.js"></script>
09.<script type="text/javascript"
10.    src="http://alexgorbatchev.com/pub/sh/2.0.320/scripts/shBrushCpp.js"></script>
11.<script type="text/javascript"
12.    src="http://alexgorbatchev.com/pub/sh/2.0.320/scripts/shBrushCSharp.js"></script>
13.<script type="text/javascript"
14.    src="http://alexgorbatchev.com/pub/sh/2.0.320/scripts/shBrushCss.js"></script>
15.<script type="text/javascript"
16.    src="http://alexgorbatchev.com/pub/sh/2.0.320/scripts/shBrushJava.js"></script>
17.<script type="text/javascript"
18.    src="http://alexgorbatchev.com/pub/sh/2.0.320/scripts/shBrushJScript.js"></script>
19.<script type="text/javascript"
20.    src="http://alexgorbatchev.com/pub/sh/2.0.320/scripts/shBrushPhp.js"></script>
21.<script type="text/javascript"
22.    src="http://alexgorbatchev.com/pub/sh/2.0.320/scripts/shBrushSql.js"></script>
23.<script type="text/javascript"
24.    src="http://alexgorbatchev.com/pub/sh/2.0.320/scripts/shBrushXml.js"></script>
25.<link type="text/css" rel="stylesheet"
26.    href="http://alexgorbatchev.com/pub/sh/2.0.320/styles/shCore.css"/>
27.<link type="text/css" rel="stylesheet"
28.    href="http://alexgorbatchev.com/pub/sh/2.0.320/styles/shThemeDefault.css"/>
29.<script type="text/javascript">
30.    SyntaxHighlighter.config.clipboardSwf
31.        = 'http://alexgorbatchev.com/pub/sh/2.0.320/scripts/clipboard.swf';
32.    SyntaxHighlighter.defaults['auto-links'] = false;
33.    SyntaxHighlighter.all();
34.</script>
35. 
36....
37.</head>
hosted version 을 사용하여 스킨 변경시의 불필요함을 최소화 한다.
사용하지 않는 언어는 제외.
기본 설정에서 auto-links 값 변경.


1-1. 기존에 SyntaxHighlighter 1.5 버전을 사용하여 글을 올렸다면, 아래 코드가 추가로 필요하다.
01.<head>
02....
03. 
04.<!-- 기존 SyntaxHighlighter 1.5 사용시 추가  -->
05.<script type="text/javascript"
06.    src="http://alexgorbatchev.com/pub/sh/2.0.320/scripts/shLegacy.js"></script>
07....
08.</head>
09.<body onLoad="dp.SyntaxHighlighter.HighlightAll('code');">

2. 글쓰기
01.<!-- 적용 예 -->
02.<pre class="brush: xml; highlight: [1];">
03.&lt;!-- Daum WebInside --&gt;
04.&lt;script type="text/javascript"  charset="euc-kr"
05.    src="http://log.inside.daum.net/dwi_log/js/dwi.js"&gt;&lt;/script&gt;
06.&lt;script type="text/javascript" &gt;
07.    _dwiPID="d-A63-***";
08.    if(typeof(_dwiCatch) == "function") { _dwiCatch();}
09.&lt;/script&gt;
10.</pre>

xml 형태의 코드를 올릴땐 &lt;(<),&gt;(>) 를 사용해서
티스토리에서 태그로 인식하지 않게 해야 대문자로의 변경을 피할 수 있다.

아래 링크에서 기본으로 제공되는 언어(brush값) 확인 가능.

Brush Alias 보기


http://alexgorbatchev.com/wiki/SyntaxHighlighter:Brushes
저작자 표시
TOTAL 114,533 TODAY 10