前回の投稿もそうですが「プログラマの日記」なものでプログラム等のソースコードをブログに書く場合が多いです。しかし表示は手を抜いていたので見苦しいものでした。以前から何とかしなければと考えていましたが、お昼休みにエイヤッとやってしまったので記録です。

まずどういうやり方が一般的なのかググってみました。JavaScriptやPHPのプラグイン的にやるケースが多いようです。行番号が付けられたりして便利そうですが、プラグインを使うのはどうも好きではありません。そんな中で見つけたのがMTサイト構築Tips集様の以下の記事。

　pre、codeタグを使ってソースコードを美しく表示する

CSSを使って結構美しく出来るようです。早速参考にしてみてCSSにPREとCODEタグの定義を組み込んでみました。おお。結構綺麗。背景画像もこのブログ用に修正して…前回の投稿のソースも見やすくなったと思いますがいかがでしょうか？MTサイト構築Tips集様ありがとうございましたm(_ _)m

ただまだ問題があります。ソースを入れる場合にソースコードの特殊文字を変換する必要があります。まあこれは比較的簡単なのでJavaScriptで作ってみました。以下長くなるので続きを読むにて。 [続きを読む]