So-netブログ用パンくずリスト(ol版)

前にもソネブロ用のパンくずリストを作成しましたが平文だとやっぱり順序というものが無いのでol要素で作りなおすことにしました。

HTML

一番最初には「トップページ」ではなくブログ名が入るように変更しました。貼り付け場所は記事ペインに<div class="articles-top"></div>という未使用の領域があるのでそこがいいかと思います。多分、seesaaブログでも使えます。


出力されるHTMLのサンプルです。href属性にはブログのトップページやカテゴリページのURLが入ります。

記事にカテゴリが登録されている場合
記事にカテゴリが登録されていない(未分類)場合

CSS

サンプルのスタイルシートです。ol要素の上下のマージンは1emにしています。li要素はdisplay:inlineによって横並びのリストになります。各テキスト間には>が入ります。content:"\003e"の値を書き換えることにより好きな文字を使うことが出来ます。