※当サイトではGoogleAdSense、アフィリエイトを使用した商品の紹介で収益を得ています。

CodeColorer

wordpress
この記事は約2分で読めます。

自分用simplicity2カスタマイズまとめ 記事を書くにあたり
cssを綺麗に表示させたくてなんか無いかな?と探していて見つけた
プログラムコード等を綺麗に表示できるプラグインのCodeColorerを入れました

現在はテーマCocoonについているコードハイライト表示を使っています
Sponsor Link
Sponsor Link

設定

設定は メニュー 設定 CodeColorer から


ボックスの幅や高さ、Tab記号のスペース数、行番号表示の有無などの設定から
cssでのカスタマイズまでする事が出来ます
テーマを変更して保存を押すとコードサンプル画像が変わりますので気に入ったのに変更しましょう

使用方法

使い方も簡単でエディタにクイックタグが表示されるので
コードをペーストし反転させてからクイックボタンをクリック

このプラグインを入れるとデフォルトである?codeボタンも置き換わるっぽいです


または先にタグを付けておいてペースト後にもう一度クイックボタンをクリックして閉じるだけです

クイックボタンをクリックすると

こんな画面が出てくるので、表示させたいコンピューター言語(HTMLやCSSなど)を入力
対応しているプログラムの場合に、それに合わせたカラーで表示してくれます
この部分は入力しなくてもコード自体は綺麗に表示してくれますよ(文字に色は付きませんが)
CodeColorer表示サンプル

これは langをHTMLにしているよ
<span style="color:#aaa;">さんぷるぅ</span>
    さんぷるぅ
<a href="sample.aaa">さんぷるぅ</a>
tabの部分も綺麗に表記してくれるよ

おわり

このプラグインが必要な人は少ないかもしれませんが、シンプルな表示が出来るので良いですね
行数を表示させる事も出来るので、コードだけじゃなく他にも色々と使い道はありそう
もし気になった方は試してみてください

[share]

【LINK】
wordpress.org:
CodeColorer

タイトルとURLをコピーしました