728x90

 원래는 이글루스를 사용했었습니다. 아직 미숙한 개발자다 보니 일하면서, 공부하면서 쓸만하다 싶은 코드 같은 것들을 정리해서 올리곤 했었는데, 막상 올려놓아도 코드가 눈에 잘 들어오지가 않더군요.

 그러다가 많은 분들이 사용하는 SystaxHighlighter의 존재를 알게 됐는데, 정작 이글루스에서는 사용할 수가 없더군요. 아예 개인홈페이지를 만들까도 생각했지만, 아직은 거기까지 신경쓸 여유는 안 되는 것 같아, 우선은 SystaxHighlighter가 사용 가능한 티스토리로 옮기게 되었습니다.

 예상이지만, 아마도 이글루는 예전처럼 일상 얘기 등에 사용하고, 티스토리는 일과 관련된 용도로 쓰게 될 것 같습니다. 이글루에 있는 프로그래밍 관련 글들도 천천히 다 옮겨와야겠습니다.

 하여튼 그런 이유로 SystaxHighlighter의 사용법 요약

※상세한 사용법을 보시려면 여기로 → SyntaxHighlighter 2.X를 tistory에 적용하기.(사실 저도 이 글 보고 알았습니다.)

 1. http://alexgorbatchev.com/wiki/SyntaxHighlighter:Download에서 다운로드받는다.

 2. 압축을 풀고, scripts 폴더와 styles 폴더의 파일들을 적당한 곳에 위치시킨다.
※티스토리는 [관리자 화면 > 스킨 > HTML/CSS편집 > 파일 업로드]에 올립니다.

 3. <head>안에 SyntaxHighlighter 스크립트를 페이지에 추가시킨다. 추가시켜야 할 내용은 압축파일의 test.html에 나와있습니다.

	
	
	
	
	
	
	
	
	
	
	
	
	
	
	
	
	
	
	
	
	

 (또는 http://alexgorbatchev.com/wiki/SyntaxHighlighter:Usage 참고)

 ※티스토리는 [관리자 화면 > 스킨 > HTML/CSS편집 > HTML/CSS편집]에 추가합니다.

 4. SyntaxHighlighter 기능을 사용할 코드는 <PRE> 안에 넣습니다. 이 때 class에 보여주고자 하는 프로그래밍 언어의 Brush aliases를 지정해주면 적절한 형태로 나오게 됩니다.

	<pre class="brush: c-sharp;">
	function test(t)
	{
		alert(t);

		return t;
	}
	</pre>

 어떤 언어에 어떤 Brush aliases를 지정해줘야 하는지는 http://alexgorbatchev.com/wiki/SyntaxHighlighter:Brushes를 참고합니다.

반응형

+ Recent posts