「記事の中にソースコードを表示させたい。」
ということはよくありますよね。
しかし当然ながら、そのままソースを書いてもコードは表示されません。
そんなときに便利なのが、WordPressのプラグイン「SyntaxHighlighter Evolved」を使った方法です。
目次
「SyntaxHighlighter Evolved」を使う
「SyntaxHighlighter Evolved」を使うと、以下のような表示ができるようになります。
「SyntaxHighlighter Evolved」を使った表示例
<strong>記事の中にソースコードを表示させたい</strong>とき。 当然ながら、そのままソースを書いてもコードは表示されません。 そんなときに便利なのが、WordPressのプラグイン「SyntaxHighlighter Evolved」を使った方法です。
この様に色付けがされてわかりやすく、スクロールもすることができます。
では次から実際の使い方を記載していきます。
「SyntaxHighlighter Evolved」をインストール
まずは「WordPressの管理画面」→「プラグイン」→「新規追加」
「SyntaxHighlighter Evolved」を検索します。
検索結果にでてきた「SyntaxHighlighter Evolved」をインストールし「有効化」します。
これで「SyntaxHighlighter Evolved」のインストールと有効化が完了しました。
つまりこれだけでもう使えるようになったのです。
インストールした「SyntaxHighlighter Evolved」を使ってみる
WordPressの記事を投稿する画面から、記述を「ビジュアル」ではなく「テキスト」の状態にして使います。
あとは簡単で、半角の[]の中に言語名（xhtmlやcss、php等）を記入し、表示したいソースを書き、最後に[/]で閉じるだけです。
[ここに言語名] ソースを書きます ソースを書きます ソースを書きます [/言語名]
このような感じです。
まとめ
基本的にはこれだけで使用できるので、今回はここまでにします。
少し細かい使い方は、以下inoshさんのブログにてわかりやすく解説されていたので、参考にしてみてください。
