えじの自由帳

今の自分を書きためるブログ

Wordpress

WordPressブログにGistを手軽に貼り付ける方法

pak135151342_tp_v

ブログにソースコードを貼り付けようと思ったとき、短いコードならcodeタグを使って貼り付けるのが簡単です。
このブログでは以前、highlight.jsの使い方を紹介しましたが、今回は少し長めのソースコードをきれいに貼り付ける方法を紹介します。

Gistとは

GitHub Gistは軽いソースコードをシェアするプラットフォームです。
GitHubのアカウントを持っている人なら使うことができます。

GitHubのアカウント作成

ログインした後、メニューバーからGistを選び、Gistを作成します。

Gistの貼り付け

Gistを作成した後、GistのURLをコピー。

%e3%82%b9%e3%82%af%e3%83%aa%e3%83%bc%e3%83%b3%e3%82%b7%e3%83%a7%e3%83%83%e3%83%88_2016-09-24_23_16_11

WordPressにはデフォルトでgistを表示するショートコードがあるらしいので、表示したい場所に

[gist {URL} /]

と入力すればOKです。{URL}のところはさっきコピーしたものを使ってください。

表示サンプル

簡単ですね!

 Wordpress