WordPress上でのソースコード表示（Gistを使用）

１．Gistのメリット・デメリット

メリット

• プラグインが不要
• 表示が軽い
• シンプルに書ける

デメリット

• ソースコードをGistに登録する手間がかかる
• プラグインを使う場合と比べると表現の自由度が低い
• 見た目が貧相

２．Gistの使用方法

①GitHubのアカウントを取得(既に持ってる人はスキップ)

まずは↓のサイトで登録を行います。
https://github.com/

※非公開のコードもGitHub上で管理したい等のwillがないのであれば無料プランで十分です。

②ソースコードをアップロード

ログインした後の画面から、右上の＋マークを選択し、New gistをクリックします。

すると↓のような画面になるので、ここにソースコードを貼り付けます。

右下の「Create public gist」ボタンをクリックすると、登録することができます。
※「Create secret gist」は課金垢向けなので無課金勢は押せません。

③Webサイトへの貼り付け

②から↓の画面に推移すると思うので、スクリプトコードをコピーします。

WordPressデフォルトのエディタを使用している場合は、HTMLカスタムブロックを使用して以下のように貼り付けます。

すると、↓のように表示されます。