Subscribed unsubscribe Subscribe Subscribe

oinume journal

Scratchpad of what I learned

WP-Syntaxをインストールしてソースコードをカラー表示

WordPressでのデフォルトのソースコードの表示がいまいち気に入らなかったので、これを綺麗にカラー表示してくれるプラグインWP-Syntaxプラグインをインストールしました。

 

で、このプラグインの良い点4つほど。

 

 

  • 対応している言語が非常に多い。C〜Ocamlまで対応している

 

 

  • <>などのタグのエスケープが必要ない

 

 

  • ソースが本文領域からはみ出す場合、横スクロールバーを出してくれる(iNoveはデフォルトではこれを出してくれず表示されなくなってしまう)

 

 

  • <pre lang="perl"> とするだけなのでお手軽

 

 

 

ただ、これはiNoveテーマの問題かもしれないのですが、<pre lang="...">で囲むと文字サイズが12pxに固定されるという問題があったので、wp-content/themes/inove/wp-syntax.css を以下のように修正しました。

 

Index: wp-syntax.css

===================================================================

--- wp-syntax.css (revision 8)

+++ wp-syntax.css (working copy)

@@ -41,7 +41,7 @@

float:none;

clear:none;

overflow:visible;

- font-size:12px;

+ font-size:108%;

line-height:1.333;

}

.line_numbers pre {

 

 

これで通常の文章と同じフォントサイズでさらに可変になります。このプラグインのおかげでブログにコードを掲載するのが少し楽しくなりましたとさ。