WordPress

【WordPress】SyntaxHighlighter Evolvedの使い方

2013年8月18日

SyntaxHighlighter Evolvedとはプログラムのソース表示の再に予約語等の特定文字を色で表示してくれたり、行数を表示してくれるWordPressのプラグインです。

2013年8月17日時点でのバージョンは 3.1.7になります。

対象言語

ハイライト表示してくれる言語は以下の通りです。

言語 ハイライト指定文字 使用JSファイル
ActionScript3as3, actionscript3shBrushAS3.js
Bash/shellbash, shellshBrushBash.js
ColdFusioncf, coldfusionshBrushColdFusion.js
C#c-sharp, csharpshBrushCSharp.js
C++cpp, cshBrushCpp.js
CSScssshBrushCss.js
Delphidelphi, pas, pascalshBrushDelphi.js
Diffdiff, patchshBrushDiff.js
Erlangerl, erlangshBrushErlang.js
GroovygroovyshBrushGroovy.js
JavaScriptjs, jscript, javascriptshBrushJScript.js
JavajavashBrushJava.js
JavaFXjfx, javafxshBrushJavaFX.js
Perlperl, plshBrushPerl.js
PHPphpshBrushPhp.js
Plain Textplain, textshBrushPlain.js
PowerShellps, powershellshBrushPowerShell.js
Pythonpy, pythonshBrushPython.js
Rubyrails, ror, rubyshBrushRuby.js
ScalascalashBrushScala.js
SQLsqlshBrushSql.js
Visual Basicvb, vbnetshBrushVb.js
XMLxml, xhtml, xslt, html, xhtmlshBrushXml.js

使い方

[html]
<html>
<head>
<title>テスト</test>
</head>
<body>
テスト
<input type="text" name="test" value="テスト文字"/>
</body>
</html>
[/html]

使い方(拡張機能）

[ハイライト指定文字 拡張機能]という使い方で表示方法を指定できます。

特定行の背景色を変更する

highlight="行数（半角数字）"（カンマ区切りで複数行指定可能）

[html highlight="2,4"]
1行目
2行目（背景変更）
3行目
4行目（背景変更）
[/html]

指定行から表示する

firstline="行数（半角数字）"

[html firstline="15"]行数を15行目から表示[/html]

行数を非表示にする

gutter="false"

[html gutter="false"]行数の非表示[/html]

折り畳んだ状態で表示する

collapse="true"

[html collapse="true"] 折りたたんで表示[/html]

タブ幅の数値を変更

tabsize="タブ幅（数値）"

[html] 標準のタブ[/html]
[html tabsize="20"] tabsize="20"でのタブ[/html]

URLの自動リンク解除

autolinks=”false”

[html]<a href="http://kaede.jp">自動リンクあり</a>[/html]
[html autolinks="false"]<a href="http://kaede.jp">自動リンクなし</a>[/html]

ルーラーの表示（特に関係ない？）

ruler="true"

[html ruler="true"]ルーラーの表示[/html]

シンプル表示

light="true"

[html light="true"]シンプル表示[/html]

-WordPress
-, ,