프로그래밍을 하시는 분들의 티스토리를 다니시다보면,
이쁘장하게 소스코드가 위의 사진처럼 이쁘게 되있는것들을 보셨을거에요. ( 위의 사진은 제 프로그램 소스 )
태그코리아, 자비스 등 소스코드를 이용하는 사이트가 많이 있습니다.
저도 역시, 이 Syntax Highlighter를 이용함으로써, 소스코드를 위의 사진처럼 할 수 있습니다.
단, 아래와 같이 이 소스를 집어널어주시고 그사이에 소스코드를 입력해주셔야합니다.
<pre class="brush: 사용하시려는, 언어 및 브러쉬 이름">
소스 코드 입력
</pre>
이렇게, 사용하시려는 언어 및 브러쉬 입력을 하시면 되는데! 티스토리에 어떻게 추가를 하느냐?
일단 제일 처음은 공식사이트에서 다운로드 받아야 합니다!
공식홈페이지에서 다운로드를 받으시면 됩니다. 위의 다운로등 버튼을 누르시면 다운로드 사이트로 이동!
최신버전은 3.0.83이군요! 저기 아래에 있는 Click Here To download 를 눌러주시면 다운로드가 됩니다!
압축을 푸시면, 위와 같이 폴더가 생기실텐데요!
Scripts 폴더와 Styles 폴더를 HTML/CSS 편집에서 추가를 시켜주셔야 합니다!
Admin 관리자에서 HTML/CSS 편집에 들어가신후,
파일 업로드로 이동하신후에 위에서 말씀드렸던 Scripts 폴더와 Styles 폴더를 추가해주셔야 합니다!
단! Scripts 폴더와 Styles 폴더안에 있는 자료를 다 업로드 해주셔야되요!
그다음 추가만 했다고 끝나는것 이 아닙니다!
SKin.html 에서 소스코드를 추가 시켜주셔야 하는데요!
Syntax Highlighter.txt
유 피디의 티스토링은, 드래그 및 복사 가 되지 않기 때문에, 다운받으셔야 합니다.
<head> 부분을 찾아서 그 아래에
위의 소스를 입력해주셔야 하구요! 또 중요한게 한가지 더있답니다!
<body> 부분에 추가 해주셔야 할 것이 있습니다!
입력해주시구요@_@ 그리고 저장을 하시면 됩니다!
그러나!
<pre class="brush: 사용하시려는, 언어 및 브러쉬 이름">
소스 코드 입력
</pre>
여기서 사용하시려는 언어 및 브러쉬 이름이 뭔지를 내가 어찌알아!?
이러시는 분들이 계실겁니다@_@!!
여기에 있는, Brush aliases 값을 적어주시면 된답니다@_@!!
그러면! 이상으로 Syntax Highlighter 티스토리에 적용방법을 마치겠습니다!?
아 맞다맞다! 테마를 설정을 하는방법을 안알려드렸군요!! T^T..
이렇게 7개의 테마들이 존재하기 떄문에 사용자들이 선택해서 쓸 수 있는데, 
그것을 어떻게 설정하느냐!? 가 제일 관건이겠지요.
유 피디가 알려드리겠습니다 쿠쿠^0^..
<!-- 소스코드하이라이터 시작 -->
<link rel="stylesheet" type="text/css" href="./images/shCoreMidnight.css">
<!-- 소스코드하이라이터 끝 -->
'Tistory@_@' 카테고리의 다른 글
| 웨스턴 유니언(Western Union Quick Cash) (0) | 2013.10.21 |
|---|---|
| 네이트 검색창 관련 홈페이지 등록하기! (0) | 2013.05.26 |
| Daily Press 유료스킨 구매! (2) | 2013.01.16 |
| 구글 애드센스의 중간 검토(?) (0) | 2013.01.10 |
| 유피디토링의 구글(Google) 애드센스 가입기! (0) | 2013.01.09 |