記事にコードを入れたい。GitHubGistはやっぱり怖いのでプラグインにした。

ワードプレスの記事の中にコードを表示させたいとき、そのまま書いたら絶対にダメな場合があります。そういう時のためにも、コードを表示させるには、何らかの手段が必要。サイトの利用は怖くなったので、ぴったりのプラグインを見つけてみました。

ららです。


こちらの記事で、記事の中にコードを挿入するなら、このサイトがオススメ!と書きました。
>>ワードプレスの記事の中にコードを書きたい!1番簡単な方法はコレ。


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

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


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


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


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


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


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


これは恐ろしいことですよ~(llllll゚Д゚)


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


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


SyntaxHighlighter は難しかった

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

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


Crayon Syntax Highlighter は不安だった

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

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


WP Code Highlight.js は残念だった

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

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

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


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


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

泣く泣く諦めました。


SyntaxHighlighter Evolved が使いやすかった!

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

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



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

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

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


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



この記事が役に立ったと思ったらクリックしてね。ららが喜びます。

 

 

 

こんな記事もありますよ☆ぜひ見ていってね!

 


最後まで読んでいただき、ありがとうございました。


ららのブログでは、あなたからの疑問・質問・お問い合わせを大歓迎しています。 こちらからいつでもメールを送ってくださいね。

>>ららにメールを送る

 

 

コメントを残す

サブコンテンツ

このページの先頭へ