「最近読んだ本」の画像表示

ブログのサイドバーに「最近、読んだ本」を画像として表示させる方法は「読書メーター」や「ブクログ」、「メディアマーカー」のサービスを利用するのが手っ取り早い。

僕は蔵書管理という本来の目的というより、ブログパーツとしての利用につられて、ブクログかメディアマーカーかで二転三転しつつ、ブクログの本棚を表示させていたのだけれど、登録の方が一向に進んでいない。そもそも既にここにブログがあるのにさらにサービスを利用するのは屋上屋を架す愚でもあり・・・。

ブクログはサービス自体はとてもいいものの、ブログパーツとしての本棚はデザインが今ひとつ冴えない。本が小さすぎて画像の鮮明でないのが一番の難点。メディアマーカーや読書メーターのシンプルな方がまだいいけれど、いずれにしてもカスタマイズには限界あり。

僕の場合は、要は最近読んだ本の画像(表紙)がシンプルにきれいに表示されればいいだけなので、結局、よそのサービスを経由しないで単純にMy Blog の中で完結させた。例により、サイドバーを持たないシングルカラムなので、各エントリの下に表示。

最近読んだ本
サイドカラムがない代わりに各エントリページの下部に表示

ついでにインデックスページとアーカイブページのリストにもテキストに加えて画像を表示させた。これでだいぶカラフルに賑やかになってくれた。本は表紙デザインも鑑賞の対象になるので、使わないともったいない。

特に後者の設定は、定義リスト(dl・dt・dd)を使ったのだけれど、dtに画像をあてる場合の、dtとddの高さがそれぞれに大小逆転するとき、どうしてもレイアウトが崩れてしまう宿命にあって、また例によりIE と Firefox とで見え方が違って・・・とこれをクリアする最後の詰めが厄介で苦労した。

インデックスと年別アーカイブページにも画像表示
インデックスと年別アーカイブページにも画像表示

でも僕はHTMLタグの中で一番、好きなのがこの定義リストだ。Definition Term に Definition Description、その果たす役割が明確で理性的でうまく使いこなせると嬉しい。


 

  Related Entries


Message

メールアドレスが公開されることはありません。