[SyntaxHighlighter] 구글 블로그에서 프로그래밍 코드 하이라이팅(Highlight)

개발자분들은

구글 블로그 ( blogger.com, blogspot.com )에서 글 등록시

프로그래밍 관련 코드를 삽입하는 경우가 많습니다.

프로그램 관련 코드를 아름답게 표현해주는 Syntax Highlight 설정 방법에 관한 글 입니다.

1. 파일을 올려 웹 링크를 얻을 수 있는 웹 계정이 있다면 구글 SyntaxHighlight 를 다운 받습니다.

다운 받은 파일의 압축을 풀어(Scripts, Styles) 모두 웹계정에 올려놓고 업로드한 파일의 웹 링크를 얻습니다.

만약 업로드 가능한 웹계정이 없다면 구글 코드 사이트의 소스가 있는 저장소인 아래 URL을 방문하여 링크 주소를 사용

http://syntaxhighlighter.googlecode.com/svn/trunk/Scripts/
http://syntaxhighlighter.googlecode.com/svn/trunk/Styles/


2. 이제 구글 블로그의 수정 화면으로 이동하여 "레이아웃 >> HTML 편집" 으로 이동

3. 템플릿 수정 텍스트 에디트 창에서 맨 아래의 "<!-- end outer-wrapper -->" 이 부분을 찾는다.

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

5. 그리고 블로그 글을 작성하며 프로그래밍 코드는 <pre name="code" class="코드언어">코드</pre> 감싼다.

6. 만약 줄 간격이 한 줄로 나오면 "설정 >> 서식 >> 줄바꿈"을 아니오로 하면 된다.

PS : 이것때문에 반나절 삽질하는 경우를 방지하기 위해 올려본다.

이 글과 관련있는 글을 자동검색한 결과입니다 [?]

by 떵꺼리 | 2009/06/11 14:28 | 프로그래밍 And 언어 관련 | 트랙백 | 덧글(0)

트랙백 주소 : http://newkain.egloos.com/tb/2369829
☞ 내 이글루에 이 글과 관련된 글 쓰기 (트랙백 보내기) [도움말]

:         :

:

비공개 덧글

◀ 이전 페이지다음 페이지 ▶