目次
目次
ゴール
WordPressのプラグインであるCrayon Syntax Highlighterを使って下の画像のように記事内にソースコードを生成することを目指します。
必要なもの
必要なもの | 価格(円) | ||
---|---|---|---|
1 | PC | ピンキリ | |
備考 | インターネット接続可能なこと | ||
2 | WordPressのアカウント | 無料 | |
備考 | 持っていない場合は、こちらを参照→WordPressのインストール方法 | ||
3 | Crayon Syntax Highlighter | 無料 | |
備考 | 直接プラグインをダウンロードする場合はこちらのサイトから→Crayon Syntax Highlighter |
Crayon Syntax Highlighter
Crayon Syntax Highlighterのインストール
Table of Contents Plusのインストール方法をまとめます。
WordPressにログインし、左側のメニューでプラグインを選択します。
下の画像の様にプラグインの画面で”新規追加”ボタンをクリックします。
するとプラグインを追加する画面が表示されるので、右上にある検索フォームにCrayon Syntax Highlighterと入力します。
検索結果で下の画像の様に表示されたCrayon Syntax Highlighterをインストールします。
Crayon Syntax Highlighterの使用方法
Crayon Syntax Highlighterがインストールが完了すると、自動で記事画面に”crayon”ボタンが出来上がり、特に設定はなくてもそのまま使用できるようになります。
“crayon”ボタンをクリックすると、ソースコード記入フォームが表示されます。
・ソースコード名
・言語の種類
・ソースコードの入力
を行います。
設定はフォントや文字サイズなどを指定できるようですが、デフォルトのままで問題ないと思います。
“add”ボタンをクリックすれば、あとは自動でソースコードのリンクが生成されます。
以上!