プラグインを入れるだけで簡単にコード表示ができるようになります。

wordpressカスタマイズなどのコードを書きたいときに

簡単にきれいに表示させることができるようになります。

おすすめは「Crayon Syntax Highlighter」です。

「Crayon Syntax Highlighter」の使い方

code
Crayon Syntax Highlighterは、エディタの上の
crayon」ボタンをクリックするだけで、ソースコードを挿入するためのエディタが現れます。
そこに表示したいコードを入力するだけでOKです。
cod3
*①と②は特に設定しなくても使えます。
③にコード記載して挿入ボタンをクリックすればOKです。
以下のように表示されます。

a:hover {
color: #fad3e4;
text-decoration: none;
}

しかし、

「 SyntaxHighlighter Evolved 」の使い方

例えば…

[css]
a:hover {
color: #fad3e4;
text-decoration: none;
}
[/css]

と入力しないといけません。
わざわざ[css]や[/css]を入力するのが面倒だという方は多いと思います。
なので「Crayon Syntax Highlighter」をおすすめしたいと思います。

新規プラグインの入れ方

①WordPressの管理画面・ダッシュボードを表示します。左側のメニューの一覧から プラグイン →新規追加 を選びプラグインのインストール画面に移動します。

②プラグインのインストール画面に移動したら、検索窓に「Crayon Syntax Highlighter」と入力し プラグインの検索 をクリックします。WordPress プラグインディレクトリ からプラグイン「SCrayon Syntax Highlighter」を自動的にインストールできます。
コード2
③プラグインのインストール画面で検索結果が表示されます。検索結果の一覧の中から「Crayon Syntax Highlighter」を探し、 いますぐインストール をクリックします。
④プラグイン Crayon Syntax Highlighter のインストールが完了しました。
インストール完了時に表示された画面の プラグインを有効化 をクリックし、プラグイン:Crayon Syntax Highlighter を有効にします。

⑤WordPressの管理画面・ダッシュボードを表示します。左側のメニューの一覧から 設定Crayon Syntax Highlighterの設定画面に移動します。

以上で簡単にきれいなコードを表示できるようになります。