結局どれが使いやすい？記事にコードを入れるためのプラグイン4つを比較

ららです。

こちらの記事で、記事の中にコードを挿入するなら、このサイトがオススメ！と書きました。

この「GitHubGist」というサービスは、コードをサイト上にアップしておいて、その埋め込みコードを記事に書けば、コードを可愛く表示してくれるというもの。

プラグインじゃないから重たくならないし、使い方もカンタンだし、ブログが変わっても同じコードで同じように表示してくれる。

確かに、すごく気に入ってはいたのですが、
あるとき突然、めちゃくちゃ不安になりはじめました。

(；´Д｀)　このサイトのサービスが終わっちゃったらどうしよう…；；

たとえば、YouTubeの動画を記事に埋め込んだ時、
知らない間にYouTube側で動画が削除されてたりすると、こんな表示になりますよね。

 

まぁこれは、人の動画を使わせてもらっているのが悪いんですが、
いくら自分の動画だとしても、YouTubeのサービス自体が終わってしまったら
当然動画は表示されなくなります。

それと同じように、知らない間にGitHubGistが終了してしまった場合、
アップしていたコードは、記事内でいっさい表示されなくなるばかりか、
どんなコードを表示させていたかの手がかりすらなくなってしまう。

これは恐ろしいことですよ～(llllllﾟДﾟ)

絶対にないとは言い切れません。無料のサービスはそこが恐ろしいところなので。
私は今まで、無料のサービスに痛い目に遭わされてきたことが何度かあります。

そう考えたらもういてもたってもいられなくなり、
やっぱりGitHubGistを使うのはやめて、素直にプラグインを使うことにしました。

でもどれを使ったらいいのか？
4つのプラグインを実際に使ってみて、初心者さんでもわかりやすいプラグインを選んでみました。

 

SyntaxHighlighter　は難しかった

調べてみた結果、現在は、SyntaxHighlighterというプラグインが一番有名だと言う話だったのですが、
使い方を読んでいると、プラグインを有効化したあとの手順が、難しくてわからなかった。

言語に合わせてファイルを設定するとかダウンロードするとか、
(；´Д｀)　ん～、やめた！
となりました。

Crayon Syntax Highlighter　は不安だった

Crayon Syntax Highlighterというプラグインもよく使われているらしいのですが、
ここのところ更新が止まっているとのこと。

将来使えなくなってもイヤだし、他にも選択肢はありそうなので、良さそうではありましたが却下しました。

WP Code Highlight.js　は残念だった

そんな時、「WP Code Highlight.js」というプラグインを知りました。
上記の２つよりも軽くて速くて使いやすいという話だったので、さっそく試してみました。

確かにカンタン。
有効化したあとは、たくさんあるスキンの中から好きなデザインを選んで、コードで囲って表示させるだけ。

こんな感じで可愛く表示できたのですが、

肝心な「HTML」を表示させようと思ったら、中身が空になって表示できない！

１行だからダメなのか？ともっと長いHTMLを入れてみましたが、途中から表示されちゃって失敗。
コードを明記すればいいという情報を得たので、「class=”html”」という文を入れてみましたがダメ。

泣く泣く諦めました。

SyntaxHighlighter Evolved　が使いやすかった！

次に出会った「SyntaxHighlighter Evolved」というプラグインは、設定もカンタンだし、使い方もカンタン。重たいとかそういうのはわかりませんが、ちゃんとHTMLも表示されるので、これに決定しました。

表示デザインは数種類ありますが、デフォルトで十分。

やっと落ち着けるプラグインに出会えました。

こういうのって、「とりあえず」でやっちゃうと、あとから全記事の表記を修正しなきゃならなくなったりするので、早いうちにしっかり決定しておいた方がのちのちのためなんです。

いいプラグインに出会えてホッとしてます。

使い方は、こちらのページに詳しく載っています。参考になさってください。
＞＞[WordPress] ソースコードを綺麗に表示！SyntaxHighlighter Evolvedプラグイン導入