[Javascript / 자바스크립트] 프로그램 개발 블로그 하시는 분들의 필수 라이브러리 - Syntaxhighlighter

개발 노트/Javascript  2013.03.12 09:00
안녕하세요 명월입니다.

이번 포스팅은 Syntaxhighlighter라이브러리에 대해 소개하겠습니다..
Syntaxhighlighter라이브러리란 간단하게 블로그 또는 웹 페이지에 프로그램 소스를 설명할 때 사용하는 라이브러리 입니다.
저도 지금까지 이 라이브러리를 몰라서 포스팅에 소스를 사진으로 첨부하거나 테이블 박스를 생성하여 소스를 넣는 방법을 택하였습니다.

그러다 보니 포스팅에 보시고 소스를 참조하기도 힘들고 (이미지를 보고 하나하나 따라쳐야 하는 불편함) 소스를 살펴보기도 힘드니요...
그럼 Syntaxhighlighter라이브러리의 사용방법과 티스토리에 적용하는 방법까지 알아보도록 하겠습니다.


위의 형태는 적용했을 때의 화면입니다.
먼저 아래의 링크에 접속을 하셔서 라이브러리를 다운로드를 받겠습니다.

링크 - Syntaxhighlighter 다운로드

최신 버전을 다운로드 하시고 적용하는 방법입니다.
테스트를 위한 폴더를 작성하시고 그 하위 폴더에 라이브러리 파일의 압축을 풀겠습니다. 그리고 나서 테스트 html파일인 test.html를 작성하겠습니다.

위와 같이 Html파일을 작성하고 실행하여 결과를 확인하겠습니다.


이번에는 티스토리에 적용해 보도록 하겠습니다
아까 전에 다운로드 받은 라이브러리들을 스킨 항목에 업로드를 하겠습니다.



그리고 티스토리 스킨 수정 부분으로 들어가서 skin.html 파일의 해더 부분에 스크립트 선언부를 입력해서 넣겠습니다.


그리고 포스팅 글을 작성할 시에 적용하는 방법입니다. 포스팅 글쓸때는 HTML 로 전환을 하셔서 코드를 입력하면 되겠습니다.



프로그램 개발에 관계된 블로그를 운영하시는 분들께는 아주 유용하게 사용될 듯 싶습니다.

PS. 끝으로 이미지의 내용은 버전 1.5때의 적용사항의 이미지 입니다. 최신 모드로 수정해서 재 업로드를 하겠습니다.


댓글 0개가 달렸습니다.
댓글쓰기