[WordPress]ソースを埋め込む方法「Gist」

WordPressにコードを埋め込む方法としてプラグインを使わずにGithubが提供する「Gist」を使う方法があるようなので試してみました。
「Gist」はプラグインではなく、Githubが提供するWebサービスです。

プラグインを使わないほうがいい理由

WordPressにはたくさんのコード埋め込みプラグインが存在しているんだけど、プラグインを利用すると表示が遅くなる、ということがあるそうです。

また、よく利用されている「Crayon Syntax Highlighter」は2年以上更新されていなかったりWordPressのアップデートで利用できなくなるリスクもあります。

Gistの使い方

Githubにログインして左上の「+」アイコンでプルダウンを開いて「New gist」を選択します。

ファイル名をコードを記入して「Create public gist」ボタンをクリックするとgistに登録されます。

登録するとこんな感じに表示されます。

EmbedのスクリプトをコピーしてWordPressの記事に貼り付けます。

WordPressに貼り付けるときはビジュアルモードで張り付けるとエスケープされて正しく表示されないので、テキストモードに変えてから貼り付けます。

こんな感じに表示されます。

これはこれでいいんだけど、コードを埋め込む際にgithub側にコード書いたりしないと行けないので作業としては煩雑になりますね。

そんなわけで「Crayon Syntax Highlighter」使っていこうと思います。

シェアする

  • このエントリーをはてなブックマークに追加

フォローする

コメントの入力は終了しました。