2006/11/29(水)両サイドバー対応のテーマ

adiary::テーマ

みたいのを作りたくなってきた。
で、どうやって実現するかというと、デフォルトのデザインだとサイドバーこんな感じになっているはず。

<div class="sidebar">
<@s.text_side0>
<module name="infomation" title="Infomation">
<module name="calendar" title="カレンダー" 
Sunday="日" Monday="月" Tuesday="火" Wednesday="水" 
Thursday="木" Friday="金" Satday="土">

<module name="recent_diary">
<module name="recent_comment">
<module name="recent_trackback">
<module name="category_list">

<module name="search" title="検索" size="12" submit="検索">
<@s.text_side1>
<module name="system-info" title="System info">
</div> <!-- End of sidebar -->

これに新たにdiv.sidebar-rightとdiv.sidebar-leftというDIVで括ることで実現しようと思う。

具体例

<div class="sidebar">

<div class="sidebar-left">
<module name="calendar" title="カレンダー" 
Sunday="日" Monday="月" Tuesday="火" Wednesday="水" 
Thursday="木" Friday="金" Satday="土">
<module name="recent_diary">
<module name="recent_comment">
<module name="recent_trackback">
</div> <!-- end of sidebar-left -->

<div class="sidebar-right">
<@s.text_side0>
<module name="infomation" title="Infomation">
<module name="search" title="検索" size="12" submit="検索">
<module name="category_list">
<@s.text_side1>
<module name="system-info" title="System info">
</div> <!-- end of sidebar-right -->

</div> <!-- End of sidebar -->

この場合サイドバーは以下のように表示される

左サイドバー

  • カレンダー
  • 最近の記事
  • 最近のコメント
  • 最近のトラックバック

右サイドバー

  • サイドバー上部拡張(@s.text_side0)
  • Infomartion
  • 検索
  • カテゴリ一覧
  • サイドバー下部拡張(@s.text_side1)
  • System Info.