Crayon Syntax Highlighter

Crayon Syntax Highlighterは、記事の中でソースコードを綺麗に表示できるWordPressプラグインです。プラグインで動作するSyntax Highlighter(シンタックス・ハイライター)です。

使い方は簡単です。プラグインをインストールすると、記事編集エディタに専用のボタンが追加され、そのボタンを押すと表示される挿入画面から表示するソースコードを登録します。

このプラグインを利用すると、ソースコードがエディタがのように綺麗に表示できます。見栄えと使い勝手が良いので非常に役に立つプラグインです。ブログでHTML/CSSやプログラミングのコードを解説する機会が多い方は、このプラグインを活用しましょう。

はじめに

このプラグインが優れている点

  • 記事の中でエディタのように綺麗にソースコードを表示できる。
  • WordPressプラグインで動作する「Syntax Highlighter」です。
  • ビジュアルエディタとテキストエディタの両方で利用できる。
  • 記事編集エディタに専用ボタンが追加され、そのボタンをクリックすると表示される挿入画面からソースコードを登録できる。
  • ショートコードを利用して記述することもできる。
  • テーマ(デザインスキン)が複数あり、好きなデザインを選べる。
  • プラグインの管理画面が日本語化されているのでわかりやすい。

コードの表示例

コードの外観を変更できるテーマが沢山用意されています。下記はその中の一例です。

Classicテーマ

Classicテーマ

Twilightテーマ

Twilightテーマ

対応言語

  1. ABAP
  2. ActionScript
  3. AmigaDOS
  4. Apache
  5. AppleScript
  6. Arduino
  7. Assembly (x86)
  8. AutoIt
  9. C
  10. C#
  11. C++
  12. CoffeeScript
  13. CSS
  14. Delphi/Pascal
  15. Diff
  16. Erlang
  17. Go
  18. Haskell
  19. HTML
  20. Lisp
  21. Lua
  22. Microsoft Registry
  23. MIVA Script
  24. Monkey
  25. MS-DOS
  26. MySQL
  27. Java
  28. JavaScript
  29. Objective-C
  30. Perl
  31. PHP
  32. PL/SQL
  33. PostgreSQL
  34. PowerShell
  35. Python
  36. R
  37. Ruby
  38. Rust
  39. Scheme
  40. Shell (Unix)
  41. Transact-SQL
  42. TeX
  43. Vim
  44. Visual Basic
  45. Visual Basic .NET
  46. YAML

インストール方法

管理画面から検索してインストールして下さい。
もしくは、WordPress.org からダウンロードし、アップロードしてインストールして下さい。

  1. WordPress管理画面 > プラグイン > 新規追加 >「Crayon Syntax Highlighter」で検索
  2. WordPress.org からダウンロード

プラグインの日本語化

Crayon Syntax Highlighterは、翻訳ファイルが用意されていますが、
「バージョン 2.8.4」では日本語の翻訳ファイルが正常に動作していないようです。

もし、プラグインの管理画面が英語表記になる場合は、
FTPソフトを利用して「/wp-content/languages/plugins/」ディレクトリにある
下記の2つの翻訳ファイルを削除して下さい。

そうすれば、プラグインのディレクトリにある翻訳ファイルが適用され、プラグインの管理画面が日本語化されます。

削除するファイル

/wp-content/languages/plugins/crayon-syntax-highlighter-ja.mo
/wp-content/languages/plugins/crayon-syntax-highlighter-ja.po

プラグインの設定

管理画面の場所

このプラグインの管理画面は下記の場所にあります。

WordPress管理画面 > 設定 > Crayon

管理画面の設定

このプラグインの管理画面は日本語化されています。
管理画面の説明を読み、必要に応じて設定を調整して下さい。
ちなみに、プラグインの設定は初期設定のままでも運用できます。

Crayon Syntax Highlighter

プラグインの使い方

コードの挿入方法

プラグインをインストールすると、記事編集エディタに専用のボタンが追加されます。
そのボタンをクリックすると、コードの挿入画面が表示されます。

ビジュアルエディタ

ビジュアルエディタ

テキストエディタ

テキストエディタ

コード挿入

記事編集画面にある専用ボタンをクリックすると、コード挿入画面が表示されます。
タイトル・言語・コードを登録して、右上にある「挿入」のリンクをクリックすると、記事編集エディタにコードが挿入されます。

コード挿入

まとめ

Crayon Syntax Highlighterは、記事の中でソースコードを綺麗に表示できるWordPressプラグインです。

このプラグインを利用すると、ソースコードがエディタがのように綺麗に表示できます。見栄えと使い勝手が良いので非常に役に立つプラグインです。