[Tistory] 소스코드 예쁘게 작성하기

 

1. SyntaxHighlighter 3.0.83 다운로드 : http://alexgorbatchev.com/SyntaxHighlighter/download/


2. 티스토리에 플러그인(다운받은 파일) 업로드

  1) 다운받은 파일 압축 풀기

 

  2) scripts 폴더와, style 폴더 안의 파일을 업로드 


 

3. HTML 소스에 css와 js 추가

 

아래 사진 밑에 드래그 되요!

 

 <link type="text/css" rel="stylesheet" href="./images/shCore.css">
<link type="text/css" rel="stylesheet" href="./images/shThemeDefault.css">
 
<script type="text/javascript" src="./images/shCore.js"></script> 
<script type="text/javascript" src="./images/shLegacy.js"></script> 
<script type="text/javascript" src="./images/shBrushBash.js"></script>  
<script type="text/javascript" src="./images/shBrushCpp.js"></script>  
<script type="text/javascript" src="./images/shBrushCSharp.js"></script>   
<script type="text/javascript" src="./images/shBrushCss.js"></script>   
<script type="text/javascript" src="./images/shBrushDelphi.js"></script>   
<script type="text/javascript" src="./images/shBrushDiff.js"></script>    
<script type="text/javascript" src="./images/shBrushGroovy.js"></script>    
<script type="text/javascript" src="./images/shBrushJava.js"></script>     
<script type="text/javascript" src="./images/shBrushJScript.js"></script>     
<script type="text/javascript" src="./images/shBrushPhp.js"></script>      
<script type="text/javascript" src="./images/shBrushPlain.js"></script>
<script type="text/javascript" src="./images/shBrushPython.js"></script>
<script type="text/javascript" src="./images/shBrushRuby.js"></script>
<script type="text/javascript" src="./images/shBrushScala.js"></script>
<script type="text/javascript" src="./images/shBrushSql.js"></script>
<script type="text/javascript" src="./images/shBrushVb.js"></script>
<script type="text/javascript" src="./images/shBrushXml.js"></script>
<script type="text/javascript" src="./images/shBrushMatlab.js"></script>
<script type="text/javascript">
 SyntaxHighlighter.all();
</script>

 

4. HTML 소스의 body 태그 안에 아래 내용 추가

 

5. 적용 방법

 

적용된 모습

 

 

 

6.

 

 

+ Recent posts