忍者ブログのCSSカスタマイズ

このカテゴリには、
HTML/CSSとか、Blogのテンプレートとかをいじってて気がついたこととかトラブルとかについて書いておきます。
今回は忍者ブログのカスタムCSSについて。

忍者ブログだと（最近はどこも出来るよね多分）、用意されてるリッチテンプレートのほかに、自分でHTMLとCSSを編集できますが、フォームに記入する方法と自分でぽちぽち書く方法が使えます
このブログも自分でいじったんですが、以下、自分でCSS部分に書きこんだ内容（フォーム入力では出来ないっぽいこと）

・Blogの全体を中心に持ってくる
CSSのbodyにtext-align:center;を追加しました。

・本文の行間を調整
同じくbodyにline-height:1.1;を追加してます。
行間が空いてないとみっしりして読みにくかった。
1.3くらいまでならAA貼っても違和感なさそう？

・左メニュー欄と本文欄のwidthを再割り当て
デフォルトではメニュー(#PluginBlock)が220px、本文(#TopBlock)が750pxです。
今回はメニューの文字をデフォルトより小さくしたので、
これをそれぞれ200px、770pxに変更しました。

・左メニューの余白調整
なんかスッカスカで見栄えが悪かったので、paddingを調整してます。
説明欄(#PluginExplanation)は5px
表示欄(#plaginContents)は順に1px 0 1px 5pxです。

・記事本文中の画像に額をつける
これも多分フォームにはなかった気がする。
CSSに
.EntryTextBox img{
border-style:solid;
border-width:1px;
border-color:#aaaaaa;
padding:3px;
margin:2px 5px 2px 5px;
}
と追加しました。パラメータは適当というかお好み。

・記事、コメント、トラックバックの本文と情報欄の間の仕切り線
これ、フォームからも入力できるんですが（本文部分と情報部分の境界線）
そのままにすると、上だけ細くて残りが太い線で囲まれます。
なので、入力したあとに、.EntryFooter、.CommentFooter、.TrackbackFooterのとこで
border-width:1px 0 0 0;にするときれいに1本だけつきます。

・コメントの管理者返信部分
ここは何故かフォームからいじる場所がありませんでした。
なのでCSSを直接いじって文字サイズと枠線の色を調整してあります。

・各記事の個別ページの下、前後記事へのマーク（<<と>>）が変換されない
何故かHTMLでは＆amp;lt;/＆amp;gt;になってます
このままブラウジングすると&lt;/&gt;になるので、実は記述はちゃんと変換されてる訳で
HTMLの真ん中辺ちょっと下にある問題の箇所から「amp;」を削ってあげるとちゃんと表示されます。

他にもあったかもしれないけどわすれてしまった。
使い勝手としてはとてもいい感じです。
でも昨日、色々いじってたら何故かbodyのbackground-colorが反映されなくなって、
原因もわからなくて結局直らなかったので、また新しいテンプレートを作ったり。。。
対策に使用中のテンプレートと同じものをバックアップとして作っておくようにしましたとさ。