2016.08.24

1,206

WP内でソースコードをサイトに掲載したい!

このエントリーをはてなブックマークに追加

プログラミングの会社などのサイトで流入を増やすために記事コンテンツを増やしていくことがあると思います。

その記事の中にソースコードの例を挙げて記事を制作したいことってあると思います。

ただ、それをするために一つ一つの記事に手を加えるのはめちゃくちゃ時間がかかりますよね。。

それをWPなら簡単に更新できてしまうプラグインをご紹介いたします!

①プラグインインストール

まず、『Crayon Syntax Highlighter』というプラグインをインストールします。

プラグイン画面で『有効化』をクリックします。

そうすると『設定』の中に『Crayon』というテキストリンクと『投稿』の記事入力エリアの『テキストタブ』に『Crayon』が出来ます。

 

②設定

基本的に『設定』の中の『Crayon』というテキストリンクの場所で設定の変更を行います。一旦初期設定のまま見てから調整するのもありだと思います。

①テーマ:表示のスタイルを好みにあわせて選択できます。

②フォント:フォントやサイズを設定できます。

③ツールバー:自分が入力したソースコードをマウスオーバーした際の操作設定です。
「コードを押し下げるのではなく、コード上に重ねて表示」にチェックを入れている場合、投稿した記事のソースをロールオーバーするとバーがかぶって表示されます。

③投稿

いよいよ入力ですが、まず『投稿』の記事入力エリアの『テキストタブ』の『Crayon』をクリックすると上記の画像が表示されます。

コードやタイトル部分に入力して挿入をクリックすれば完了です。

下記のように表示されます。

 

簡単なので是非試してみてください!

このエントリーをはてなブックマークに追加

ヘノブ編集部


この記事の投稿者:

次