프로그램 소스 코드와 같이 구문 강조(code highlight) 기능이 필요한 코드를 블로그에 포함(embeded)시키기 위해서는 페이스트빈(pastebin)이라는 서비스가 필요하다. 물론 티스토리나 네이버의 경우 자체 편집기에 프로그램 소스 등을 포함시키기 위한 별도의 기능을 제공하고 있다. 특히 티스토리의 경우 SyntaxHightlight 플로그인을 추가하면 좀 더 다양한 구문 강조 기능을 사용할 수 있다.

대표적인 페이스트빈 서비스로는 자바스크립트 기반의 SyntaxHighlighter가 있으며, 이 밖에도 'code highlight'나 'syntax highlight'라는 검색어로 구글링해보면 다양한 프로그래밍 언어로 구현된 온라인 서비스와 SyntaxHighlight와 같이 블로그 소스내에 끼워 넣을 수 있는 소스로 제공되는 페이스트빈 서비스를 찾을 수 있다.

여기서는 깃허브에서 제공하는 페이스빈 서비스인 Gist를 이용하여 블로그에 소스 코드를 포함시키는 방법을 알아보겠다.

우선 깃허브를 가입하고 계정을 생성한다. 그리고 Gist로 접속하여 파일을 생성하면 끝!

https://gist.github.com

먼저 확장자를 포함한 파일 이름를 입력한다.

본문에 소스를 입력한 뒤에 gist를 생성한다.

이때 secret과 public을 구분하여 만들 수 있는데 public은 외부의 검색을 허용한다는 정도만 이해하면 된다. Github의 private와 public 저장소의 차이와 비슷.

우측 상단에 끼워넣기(embed)를 위한 복사 기능이 있으므로 복사한 후 블로그 소스에 <script> 블럭을 붙여넣기 하면 완료.

참고로 이 기능은 HTML 코드 편집을 지원하는 블로그에만 가능하며 HTML 코드 편집을 지원하지 않을 경우 Color Scripter와 같은 온라인 페이스트빈 서비스를 이용하면 된다.

+ Recent posts