SyntaxHighlighter Evolved 記事でソースコードを表示できるWordPressプラグイン

2017/12/14 wordpress

WordPressプラグインの「SyntaxHighlighter Evolved」は
記事内でソースコードを記述したいとき、奇麗なソースコードを表示できるプラグインです。
使い方は、ショートコードを利用して記述するとのこと。
自分も忘備録としてソースコードを今後、記述していく事も多くなりそうなので
この「SyntaxHighlighter Evolved」をインストールしたいと思います。

SyntaxHighlighter Evolved のインストール


Wordpress管理画面の「プラグイン」→「新規追加」を選択。
 


キーワードに「SyntaxHighlighter Evolved」と入力し、表示されたプラグインを「今すぐインストール」をクリック。
 


「有効化」をクリック。インストール完了。

SyntaxHighlighter Evolved の設定


今回は、「バージョン2.x」にしました。
 


「ツールバーを表示する」にチェック
 


「設定を保存」をクリック
 


表示したソースコードの右上にツールバーが表示されるようになりました。ソースの表示ができるので便利ですね。

使い方

ソースコードを、[表記したい言語] と [/表記したい言語]で囲んで記述。
後は、プラグインがソースコードを表示してくれます。

PHPのソースコードを表示してみる

記述の仕方

結果

function megaphone_me() {
    return '<img src="http://www.kyulene.com/wp-content/uploads/2017/05/メガホン2.png" alt="" width="24" height="20" class="alignnone size-full wp-image-217" />';
}
add_shortcode('megaphone', 'megaphone_me');

PHP以外にも、HTMLやCSS、JavaScriptなどの表示もできちゃう優れもの。