'HTML+CSS+BLOG'에 해당되는 글 1건

  1. 2014.07.25 SyntaxHighlighter 3.0.83 코드를 보기 좋게 출력해보자
HTML+CSS+BLOG2014. 7. 25. 22:15

SyntaxHighlighter 3.0.83 코드를 보기 좋게 출력해보자



  1. 블로그에 소스 코드를 보기 좋게 표현할 방법을 찾아 보았습니다.
  2. http://alexgorbatchev.com/SyntaxHighlighter/download/
  3. 에서 SyntaxHighlighter 3.0.83를 다운받아 임시 폴더에 압축을 풉니다.
  4. 티스토리 (Tistory) > HTML/CSS 편집 > 파일업로드 > 하단 +추가 버튼을 클릭합니다.
  5. 다운받은 syntaxhighlighter_3.0.83 폴더에서 아래와 같이 업로드를 합니다.
    1. scripts 폴더에 있는 모든 파일을 업로드 합니다.
    2. styles 폴더에서 shCore.css, shCoreMidnight.css, shThemeMidnight.css를 업로드합니다.
  6. HTML/CSS 편집 > skin.html 에서 </head> 바로 위에 아래 줄을 추가합니다.
    1. <link rel="stylesheet" type="text/css" href="./images/shCoreMidnight.css">
  7. HTML/CSS 편집 > skin.html 에서 </body> 바로 위에 아래 줄 모두를 추가합니다.
    2. <script type="text/javascript" src="./images/shCore.js"></script>
    3. <script type="text/javascript" src="./images/shAutoloader.js"></script>
    4. <script type="text/javascript" src="./images/shBrushCpp.js"></script>
    5. <script type="text/javascript" src="./images/shBrushCSharp.js"></script>
    6. <script type="text/javascript" src="./images/shBrushCss.js"></script>
    7. <script type="text/javascript" src="./images/shBrushJava.js"></script>
    8. <script type="text/javascript" src="./images/shBrushJScript.js"></script>
    9. <script type="text/javascript" src="./images/shBrushSql.js"></script>
    10. <script type="text/javascript" src="./images/shBrushXml.js"></script>
    1. <script type="text/javascript">SyntaxHighlighter.all(); </script>
    2. 설치 작업이 모두 끝났습니다.
    3. HTML모드에서 글쓰기를 선택하고       
    5. <pre class="brush: 원하는 brush Name">
    6. 소스 코드 입력
    7. </pre>
    8. 를 적용합니다.

 

Posted by 코드버무려

티스토리툴바