WordPressにソースコードを張付ける方法

以前、文字を囲むをテーマにまとめたのですが、そのときから、漠然ともう少しコードを綺麗に貼りたいなと思ってました
調べてみると意外に簡単に解決できることがわかりました。

プラグインで一発解決

一定しまえばみもふたもありませんが、こちらのプラグインで解決です。

Crayon Syntax Highlighter

というプラグインなんですが早速インストールして使ってみましょう。

まずはインストール

ダッシュボードのプラグインから「Crayon Syntax Highlighter」を検索してインストールします。インストールしたあとに「有効化」を忘れないこと。

早速試してみたのですが、なんとメニュー画面が英語に‥

なんでも最近アップデートされたみたいでそのときに以来日本語になってないような感じなのです。

早速対処しました。

自分のドメイン.com/public_html/wp-content/languages/plugins
フォルダにある
crayon-syntax-highlighter-ja.mo
crayon-syntax-highlighter-ja.po

のファイルを消すみたいです。何か不具合がと思っていたのですが、今のところは大丈夫です。

早速使ってみましょう

新しくメニューが出ているので、ここをクリックします。

タイトルとソースコードを入れて右上の「挿入」を押すと完成です。

<span style="font-size: 12px;"><code>&lt;div style="padding: 5px 10px; color: #ffffff; background: #0000ff;"&gt;タイトル&lt;/div&gt;
&lt;div style="padding: 10px; border: 1px solid #0000ff; background: #ffffff;"&gt;本文&lt;/div&gt;
</code></span>

やってみると意外に簡単にできました。

あとで気づいたのですが、過去記事のソースコーコードも綺麗になってて満足です