2011년 9월 14일 수요일

구글 블로거에서 프로그램 코드 예쁘게 꾸미기(Google code prettify)

구글이 재미있는 기능(Google code prettify)을 만들어 제공하고 있었다. 아래 코드[1]를 블로거에 삽입하면 자바스크립트(Javascript)를 이용해 사용자가 입력한 프로그램 코드에 자동으로 색깔을 입힌다.
편하게 볼 수 있게 [1]에 있는 내용을 그대로 번역한다.

1. 템플릿 -> HTML 편집을 누른다. '계속' 단추를 눌러 편집모드로 들어간다.

2. '<head>' 밑에 아래 코드를 삽입한다.
<link href='http://google-code-prettify.googlecode.com/svn/trunk/src/prettify.css' rel='stylesheet' type='text/css'/> <script src='http://google-code-prettify.googlecode.com/svn/trunk/src/prettify.js' type='text/javascript'> </script>

3. '</head>' 다음에 나오는 '<body ... >'에 다음 코드로 추가한다.
<body onload='prettyPrint()'>

4. 수정이 다 끝났으니 '템플릿 저장'을 누르고 '닫기'를 누른다.

5. 코드를 예쁘게 꾸미고 싶은 곳에 아래 코드를 삽입한다.
<pre class="prettyprint"> int foo=0; NSLog(@"%i", foo); </pre>

그러면 브라우저 상에는 아래처럼 나타난다.
int foo=0; NSLog(@"%i", foo); 

[참고문헌]
[1] How to use prettify with blogger/blogspot?, stackoverflow, 2009.
Enhanced by Zemanta

댓글 2개 :

욕설이나 스팸글은 삭제될 수 있습니다. [전파거북이]는 선플운동의 아름다운 인터넷을 지지합니다.