Configuration
| Name | Value | Description |
|---|---|---|
| bloggerMode | false | blogger.com 에서 사용중이라면 true로 설정할 것 |
| clipboardSwf | null | clipboard로 사용할 url을 적는다. |
| strings | Object | 각종 메시지를 재정의할 수 있다. 자세한 설정을 참조 +_+ |
| stripBrs | false | br 태그 무시 여부 결정 |
| toolbarItemWidth | 16 | 툴바 아이템 가로 크기 |
| toolbarItemHeight | 16 | 툴바 아이템 세로 크기 |
| tagName | "pre" | 다른 태그를 사용하고 싶다면 설정. |
위의 설정을 Syntax highlighter 로드하는 js 안에 입력하여 사용.
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 | <script type="text/javascript">SyntaxHighlighter.defaults['toolbar'] = false; // 툴바 설정 (기본값 True)//SyntaxHighlighter.defaults['gutter'] = true; // 라인 번호 설정 (기본값 True)//SyntaxHighlighter.defaults['tab-size'] = 2; // 탭 사이즈 설정 (기본값 4)//SyntaxHighlighter.defaults['first-line'] = 1; // 라인 시작 숫자 (기본값 1)//SyntaxHighlighter.defaults['auto-links'] = false; // 링크 설정 (기본값 true)SyntaxHighlighter.config.bloggerMode = true;SyntaxHighlighter.config.clipboardSwf = 'scripts/clipboard.swf';//SyntaxHighlighter.config.stripBrs = true;...SyntaxHighlighter.all()</script> |
Default
각종 기본 설정을 재정의할 수 있다.
| Name | Value | Description |
|---|---|---|
| auto-links | true | url 등이 있을때 자동으로 링크 걸어주는지 여부 |
| class-name | '' | custom class 사용시 설정 |
| collapse | false | collapse로 사용할 것인가? view source등을 클릭해야 소스가 보이도록.. |
| first-line | 1 | 첫 라인의 라인넘버 |
| gutter | true | 라인넘버 보이도록? |
| highlight | null | 라인별로 강조하고 싶은 경우 [1, 2, 3] 또는 해당 라인넘버 |
| html-script | false | 스크립트(php, jsp 등)에 포함된 HTML/XML을 하이라이트 할 것인가 여부, true로 설정하면 반드시 shBrushXml.js를 로드하여야 한다. |
| light | false | toolbar + gutter 를 한 옵션으로 처리할 때 사용. |
| smart-tabs | true | 스마트 탭 사용 여부 |
| tab-size | 4 | 탭 크기. |
| toolbar | true | 툴바 켜고 끄기 |
| wrap-lines | true | 줄바꿈 할 것인지 설정 |
- 기본 설정은 default에 정의 하여 아래와 같이사용할 수 있으며
1 2 3 4 5 6 7 8 9 10 11 12 13 14 | <script type="text/javascript">SyntaxHighlighter.defaults['toolbar'] = false; // 툴바 설정 (기본값 True)SyntaxHighlighter.defaults['gutter'] = true; // 라인 번호 설정 (기본값 True)SyntaxHighlighter.defaults['tab-size'] = 2; // 탭 사이즈 설정 (기본값 4)SyntaxHighlighter.defaults['first-line'] = 1; // 라인 시작 숫자 (기본값 1)SyntaxHighlighter.defaults['auto-links'] = false; // 링크 설정 (기본값 true)SyntaxHighlighter.config.bloggerMode = true;SyntaxHighlighter.config.stripBrs = true;...SyntaxHighlighter.all()</script> |
만약 여러가지 옵션을 동시에 지정하고 싶을 경우 세미콜론(;)으로 구분하여 연속으로 지정하면 됩니다
1 | <pre class="brush: js; ruler: true; first-line: 10; highlight: [2, 4, 6]">...</pre> |
brush 종류
| Brush name | Brush aliases | File name |
|---|---|---|
| ActionScript3 | as3, actionscript3 | shBrushAS3.js |
| Bash/shell | bash, shell | shBrushBash.js |
| C# | c-sharp, csharp | shBrushCSharp.js |
| C++ | cpp, c | shBrushCpp.js |
| CSS | css | shBrushCss.js |
| Delphi | delphi, pas, pascal | shBrushDelphi.js |
| Diff | diff, patch | shBrushDiff.js |
| Groovy | groovy | shBrushGroovy.js |
| JavaScript | js, jscript, javascript | shBrushJScript.js |
| Java | java | shBrushJava.js |
| JavaFX | jfx, javafx | shBrushJavaFX.js |
| Perl | perl, pl | shBrushPerl.js |
| PHP | php | shBrushPhp.js |
| Plain Text | plain, text | shBrushPlain.js |
| PowerShell | ps, powershell | shBrushPowerShell.js |
| Python | py, python | shBrushPython.js |
| Ruby | rails, ror, ruby | shBrushRuby.js |
| Scala | scala | shBrushScala.js |
| SQL | sql | shBrushSql.js |
| Visual Basic | vb, vbnet | shBrushVb.js |
| XML | xml, xhtml, xslt, html, xhtml | shBrushXml.js |
소스코드를 입력할때 주의해야할 사항은 꺽쇠 <>를 변환해줘야 합니다.
만약 그대로 꺽쇠를 작성하면 제대로 동작하지 않을 수 있습니다.
하지만 이러한 꺽쇠를 그때그때 수정해야 하면 너무 번거롭기 때문에
꺽쇠를 자동으로 변환해주는 사이트를 소개하며 포스팅을 마치겠습니다.
parkjuwan 사이트 : (http://parkjuwan.dothome.co.kr/webapp/ltgt_conv/)
출처 : http://chongmoa.com/webtool/3007
'기타' 카테고리의 다른 글
| 윈도우 메모리 관리 툴 - RAMMAP (0) | 2018.03.08 |
|---|---|
| SyntaxHighlighter 셋팅 (0) | 2018.02.27 |