Blogger(Blogspot)에서 소스코드 표시

블로그에서 소스코드를 포스팅하기 위한 방법입니다.

1. 먼저 http://alexgorbatchev.com/wiki/SyntaxHighlighter 에서 코드를 다운로드 받습니다.
2. 압축을 풀면 styles, scripts, src의 폴더가 3개 생깁니다.
3. styles 폴더의 이미지 파일들과 shCore.css파일과 마음에 드는 테마파일을 하나 올립니다.
(올리는 곳은 저같은 경우 Google 사이트 도구에 올려서 쓰고 있습니다.)
4. scripts 폴더의 shCore.js파일과 shBrushPlain.js 그리고 원하는 프로그래밍 언어들의 파일도 올립니다.
5. 레이아웃 > HTML 편집 > 스킨 수정에서 제일 하단에 밑의 코드를 입력합니다.

<!-- end outer-wrapper -- >

<link href='업로드한사이트경로/shCore.css' rel='stylesheet' type='text/css'/>
<link href='업로드한사이트경로/SyntaxHighlighter.css' rel='stylesheet' type='text/css'/>
<script language='javascript' src='업로드한사이트경로/shCore.js'/>
<script language='javascript' src='업로드한사이트경로/shBrushPlain.js'/>
<script language='javascript' src='업로드한사이트경로/shBrushCpp.js'/>
<script language='javascript'>
    SyntaxHighlighter.all();
</script>

6. 블로그에 포스팅 할 때는

<pre class="brush: 코드타입">
코드내용
</pre>

와 같이 brush 부분에 자신에게 맞는 코드타입 (cpp, plain, xml등등)을 써주면 됩니다.
7. 코드타입의 class부분에 대소문자를 구별하므로 Brush가 아닌 brush로 써줘야합니다.
8. 물론 <기호나 >은 <, >로 바꿔줘야 하지만, blogger 에디터상에서 해주는듯하네요.
(혹시 소스가 제대로 안 나오는 경우는 HTML 편집에서 일일이 수정 'ㅁ';)