구글 블로그(Blogger)에 SyntaxHighlighter 적용하기

구글 블로거(blogspot)에 SyntaxHighlighter 적용하는 방법은 아래와 같이 두 가지이다.


1. SyntaxHighlighter 다운로드 후 블로그 또는 기타 웹에 업로드 후 블로그에 적용

   * 블로거(blogger)에는 파일을 올릴 수가 없기 때문에 불가한 방법
   ** tistory 블로그에서는 가능한 방법으로 알고 있다.

   적용순서

1. 다운로드 페이지 에서 다운로드
2. 블로거가 아닌 기타 웹페이지에 파일 업로드
3. 업로드한 곳의 링크정보를 토대로 코드 긁어오기
4. 블로거->템플릿->HTML 편집->클릭
5. </head> 검색
6. </head> 바로 위에다 붙여넣기.
7. 저장
8. 테스트 글 작성

 

2. 간편하게 블로그에 적용(다운로드 및 업로드 생략)

   * 내가 적용한 방법으로 매우 간단하다.

   적용순서

1. 아래의 '<!--Start of SyntaxHighlighter-->' 로 시작하는 코드를 복사한다.
2. 블로거->템플릿->HTML 편집->클릭
3. </head> 검색
4. </head> 바로 위에다 붙여넣기.
5. 저장
6. 테스트 글 작성

 테스트 글 작성법 

1. 글쓰기 버튼 클릭
2. 글쓰기 상태에서 소스코드 붙여넣기
3. HTML 버튼을 클릭하여 HTML 소스가 보이도록 변경
4. 맨 상단에 <pre class="brush:TYPE"> 문구 추가
5. 맨 하단에 </pre> 문구 추가
6. 게시 또는 업데이트 버튼 클릭
7. 확인

*TYPE은 언어 종류를 나타내며 종류에 따라 적용하면 된다.
c, cpp, csharp, css, delphi, pascal, java(or Java), 
javascript(or js, jscript), php, python(or py), 
ruby(or rb, rails, ror), sql, vb(or vb.net), xml, html, xhtml, xslt



<!--Start of SyntaxHighlighter--> <link href='http://alexgorbatchev.com/pub/sh/2.1.382/styles/shCore.css' rel='stylesheet' type='text/css'/> <link href='http://alexgorbatchev.com/pub/sh/2.1.382/styles/shThemeDefault.css' rel='stylesheet' type='text/css'/> <script src='http://alexgorbatchev.com/pub/sh/2.1.382/scripts/shCore.js' type='text/javascript'> </script> <script src='http://alexgorbatchev.com/pub/sh/2.1.382/scripts/shBrushCpp.js' type='text/javascript'> </script> <script src='http://alexgorbatchev.com/pub/sh/2.1.382/scripts/shBrushCSharp.js' type='text/javascript'> </script> <script src='http://alexgorbatchev.com/pub/sh/2.1.382/scripts/shBrushCss.js' type='text/javascript'> </script> <script src='http://alexgorbatchev.com/pub/sh/2.1.382/scripts/shBrushJava.js' type='text/javascript'> </script> <script src='http://alexgorbatchev.com/pub/sh/2.1.382/scripts/shBrushJScript.js' type='text/javascript'> </script> <script src='http://alexgorbatchev.com/pub/sh/2.1.382/scripts/shBrushPhp.js' type='text/javascript'> </script> <script src='http://alexgorbatchev.com/pub/sh/2.1.382/scripts/shBrushPython.js' type='text/javascript'> </script> <script src='http://alexgorbatchev.com/pub/sh/2.1.382/scripts/shBrushRuby.js' type='text/javascript'> </script> <script src='http://alexgorbatchev.com/pub/sh/2.1.382/scripts/shBrushSql.js' type='text/javascript'> </script> <script src='http://alexgorbatchev.com/pub/sh/2.1.382/scripts/shBrushVb.js' type='text/javascript'> </script> <script src='http://alexgorbatchev.com/pub/sh/2.1.382/scripts/shBrushXml.js' type='text/javascript'> </script> <script src='http://alexgorbatchev.com/pub/sh/2.1.382/scripts/shBrushPerl.js' type='text/javascript'> </script> <script language='javascript'> SyntaxHighlighter.config.bloggerMode = true; SyntaxHighlighter.config.clipboardSwf = &#39;http://alexgorbatchev.com/pub/sh/2.1.382/scripts/clipboard.swf&#39;; SyntaxHighlighter.all(); </script> <!--End of SyntaxHighlighter-->