開発ブログやちょっとした備忘録として、サイトにプログラムを掲載したい時は「シンタックスハイライト」という機能がついたエディタを使うことで、読みやすいプログラムとして掲載することができます。
※「シンタックスハイライト」とは、プログラム中で使う一部の構文（関数、変数など）を見やすいように色分けして表示してくれる機能です。
WordPressの場合、シンタックスハイライトエディタのプラグインもあるのですが、テーマファイルとの互換性により使えなかったり、表示がサイトデザインにあったものがない場合があります。
そんな時は、ぜひ「Gist」を使って見ることをおすすめします。
「Gist」は開発共有Webサービスを提供しているGitHubが手がける、プログラムを視覚的に見やすくサイト上に貼り付けることが可能となるサービスです。
デザインがハイクオリティなことはもちろん、操作性も優れていて、WEB上のエディタで書き込む際には自動インデントタブ機能（関数の始まりと終わりで文字の開始位置を自動で揃えてくれる機能）がついていて、非常に使いやすいのが特徴です。
サイトに貼り付ける時は、保存する時に表示されるスクリプトタグを貼り付けるだけでよく、プログラムを編集したい場合はGist上で編集するだけで、埋め込み先のサイト自体には何も手を加える必要がありません。
このため、複数のサイトで同じプログラムを乗せる時などは、本来であればサイトの数だけ編集を行う必要があったものが１箇所でよくなるというメリットもあります。
この記事では、そんな便利で見やすい「Gist」の使い方を解説していきます。
ちなみに、WordPressのプラグインでソースコードを見やすく掲載したい方は、以下の記事を参考にしてみてください。
WordPressでソースコードを美しく表示するプラグイン「Syntax Highlighter Evolved」の導入手順
WordPressでソースコードを美しく表示するプラグイン「Syntax Highlighter Evolved」の記述方法
GitHubへの登録
「Gist」はGitHubが提供するWebサービスなので、使うためにはGitHubのアカウントが必要になります。
以下のページからユーザー登録を行いましょう。
外部ページGitHubユーザー登録ページ
ステップ１ではユーザー情報を入力し、ステップ２ではプラン（無料プランで良いです）を選択し、「Continue」ボタンをクリックするとユーザーアカウント登録用のメールがステップ１で入力したメールアドレス宛に届きます。
メールを確認して、「Verify email adress」というリンクをクリックすればアカウントの作成が完了となります。
すでにアカウントを持っている方は、以下のページからログインしてください。
外部ページGistログインページ
Gistの使い方
Gistにログインすると、以下のような画面が表示されます。
タイトルとプログラムを記述して、公開ボタンをクリックするとプログラムをサイトに埋め込むことができるようになります。
ちなみに、保存の時はボタンが２つありますが、サイトに貼り付ける場合は「Create public gist」を選択してください。
ここで気をつけてほしいのが、初めてGistを保存する時は必ず「Create public gist」で保存するということです。
なぜかというと、初めて保存するGistがプライベート用になっていると、GitHubのシステムがアカウント自体を「プライベートアカウント」として認識してフラグを立て、その後パブリック用にGistを登録してもサイト上にGistが表示されないことがあるためです。
このような状態になってしまった場合は、この記事の一番下で紹介している方法でGitHubに連絡を入れると、アカウントのフラグを「公開用」に切り替えてもらえます。
Gistを保存したら、以下のような画面が表示されます。
記事をサイトに貼り付ける場合は、貼り付けようのリンクをコピーしてサイト上に貼っていきましょう。
スクリプトリンクを記事に貼り付けたら、サイト上にGistが表示されることを確認しましょう。
また、デザインをカスタマイズしてGistのフッター「【タイトル名】 hosted with Gist」という部分を非表示にしたい場合は、サイトのスタイルシートに以下のCSSを追記することで非表示にすることができます。
Gistのフッターを非表示にするスタイル
リンクを貼り付けてもサイト上でGistが表示されない場合
Gistの公開ではプライベートとパブリックの２種類の公開方法がありますが、自分のサイト上でGistを使いたい時はパブリックで公開しましょう。
プライベート用になっていると表示されません。
また、次のようなメッセージが表示される場合は、アカウントが「プライベート用」としてフラグを立てられている状態で、サイト上にリンクを貼り付けてもGistを見ることができません。
このような場合は、以下のコンタクトページからGitHubに直接連絡を入れる必要があります。
外部ページGitHub公式問い合わせフォーム
問い合わせを入れたところ、１時間ほどでアカウントのフラグは削除され、Gistを公開できるようになりました。
