制作Tipstutorials & tips

サイドバーで年別カテゴリーリストをツリー化する

サイドメニューによくある、月別メニューをツリー化する方法をメモ。
最終的にやりたいことは、年別メニューをクリックすると月別リストがするするっとプルダウンされ、そこをクリックすると月別アーカイブページへ とぶ、というもの。

<ul>
<mt:IfArchiveTypeEnabled archive_type="Yearly">
<mt:ArchiveList archive_type="Yearly">
<li><$mt:ArchiveTitle$>
<ul><li>
<mt:ArchiveList archive_type="Monthly">
<a href="<$mt:ArchiveLink$>"><$mt:ArchiveTitle$> [<$mt:ArchiveCount$>]</a>
</mt:ArchiveList></li></ul></li>
</mt:ArchiveList>
</mt:IfArchiveTypeEnabled>
</ul>


あとは、jQueryで開閉パネルを読み込めばOKです。

<script type="text/javascript">
$(document).ready(function(){
$("ul").hide();
$("li").click(function(){
$(this).toggleClass("active").next().slideToggle("slow");
});

});
</script>

上部へ