티스토리 블로그에 SyntaxHighlighter 3.0.83 설치하기
syntaxhighlighter_3.0.83.zip우선 위 링크의 파일을 받아 압축을 풉니다.
1. 파일 업로드
우선 위에 올린 파일을 받아 압축을 푼 후 "스킨편집 -> HTML편집 -> 파일 업로드" 으로 가서
"script" 폴더와 "styles"폴더의 모든 파일을 업로드 해 줍니다.
2. HTML 수정
"스킨편집 -> HTML편집 -> HTML"에서 </head>바로 위에 아래 코드를 넣어주고 저장합니다.
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 | <!-- SyntaxHighlighter 설정 시작--> <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> <link type="text/css" rel="stylesheet" href="./images/shCore.css"> <link type="text/css" rel="stylesheet" href="./images/shThemeDefault.css"> <script type="text/javascript"> SyntaxHighlighter.all(); </script> <!-- SyntaxHighlighter 설정 끝--> <!-- SyntaxHighlighter 스크롤 안보이기 코드 시작 --> <style> .syntaxhighlighter { overflow: hidden !important; } </style> <!-- SyntaxHighlighter 스크롤 안보이기 코드 끝 --> | cs |
3. 사용법
글 작성시 HTML에 체크 후
여기는 코드내용입니다.
#include<stdio.h>
int main()
{
printf("Hello World!");
return 0;
}
</pre>
위 스크립트의 </pre> 위에 코드를 적어주시면 아래처럼 코드에 컬러가 입혀져서 나오게 됩니다.
참고 URL : http://alexgorbatchev.com/SyntaxHighlighter/
제 블로그의 내용이 도움이 되셨나요?
▼▼▼▼▼▼▼▼▼▼▼
여러분의 공감과 댓글이 큰 힘이됩니다 :)
https://i.imgur.com/UrJHGVd.png
로샤님이 쓰신 댓글에 답글을 쓴다는게 실수로 삭제를 해버렸네요 죄송;;;