[blog] 티스토리 SyntaxHighlighter 사용하기 (코드 구문강조)

설치방법은 홈페이지에 간단하게 나와있어 쉽게 따라할수 있다. 하지만 홈페이지는 모두 영어로 되어있다. 

영어에 자신없는 분들에게 도움이 되고자 설치와 적용방법에 대해서 포스팅 하겠다.(나도 겨우 적용하였다....)

SyntaxHighlighter 설치방법(홈페이지)

SyntaxHighlighter 설치 방법

● 먼저 SyntaxHighlighter 홈페이지에서 최신버전을 다운받는다.

다운로드 링크

● 압축을 풀고나서 사용할 파일은 script폴더에 자신이 사용할 언어의 js파일과 

style폴더에 shCore.css와 적용할 스타일 파일을 'HTML/CSS 편집'에 '파일업로드'에 올려준다

● 위 사진과 같이 선택한 파일을 아래 사진과 같이 업로드 한다.

● 마지막으로 HTML 코드를 추가해주어야 하는데 아래 사진과 같이 head 안에 js파일과 css파일을 포함시켜주고, 

</body> 위에 자바스크립트 코드를 넣어준다.

body 추가.txt head 추가.txt

SyntaxHighlighter 사용 방법

HTML모드에서 <pre class="brush:사용할 언어"> 내용 </pre> 처럼 작성하면 된다.

/*
 * SyntaxHighlighter
 * 이와 같이 작성할 수 있다.
 */
function foo()
{
    if (counter <= 10)
        return;
    // it works!
}

● 각 언어별 "bursh:" 다음으로 사용할 이름을 마지막으로 마치겠다.

사진참조