2009년 06월 11일
[SyntaxHighlighter] 구글 블로그에서 프로그래밍 코드 하이라이팅(Highlight)
개발자분들은
구글 블로그 ( blogger.com, blogspot.com )에서 글 등록시
프로그래밍 관련 코드를 삽입하는 경우가 많습니다.
프로그램 관련 코드를 아름답게 표현해주는 Syntax Highlight 설정 방법에 관한 글 입니다.
1. 파일을 올려 웹 링크를 얻을 수 있는 웹 계정이 있다면 구글 SyntaxHighlight 를 다운 받습니다.
다운 받은 파일의 압축을 풀어(Scripts, Styles) 모두 웹계정에 올려놓고 업로드한 파일의 웹 링크를 얻습니다.
만약 업로드 가능한 웹계정이 없다면 구글 코드 사이트의 소스가 있는 저장소인 아래 URL을 방문하여 링크 주소를 사용2. 이제 구글 블로그의 수정 화면으로 이동하여 "레이아웃 >> HTML 편집" 으로 이동
http://syntaxhighlighter.googlecode.com/svn/trunk/Scripts/
http://syntaxhighlighter.googlecode.com/svn/trunk/Styles/
3. 템플릿 수정 텍스트 에디트 창에서 맨 아래의 "<!-- end outer-wrapper -->" 이 부분을 찾는다.

4. 찾은 태그 뒤 부터 아래의 그림처럼 구글 SyntaxHighlight의 사용법대로 태그를 삽입한다.

5. 그리고 블로그 글을 작성하며 프로그래밍 코드는 <pre name="code" class="코드언어">코드</pre> 감싼다.
6. 만약 줄 간격이 한 줄로 나오면 "설정 >> 서식 >> 줄바꿈"을 아니오로 하면 된다.
PS : 이것때문에 반나절 삽질하는 경우를 방지하기 위해 올려본다.
구글, 블로그, blog, blogger.com, blogger, blogspot, SyntaxHighlighter, highlighter, code, language, google, 언어
# by | 2009/06/11 14:28 | 프로그래밍 And 언어 관련 | 트랙백 | 덧글(0)




☞ 내 이글루에 이 글과 관련된 글 쓰기 (트랙백 보내기) [도움말]