« サッポロ一番 塩らーめん バジルとオリーブオイル仕上げ♪ | メイン | バスターのヲイタ。 »

2007年08月28日

●月別アーカイブの年別ツリー化+折りたたみ。

現在、HTMLで構築しているあるサイトを、MTへ移行する作業を
行っているのでつが、その際にデザイン上、月別アーカイブを
折りたたむ必要があって調べたものを、下記サイトを参考に、
本BLOGにも摘要してみますた。

≫小粋空間 - JavaScript 不要な月別アーカイブの年別ツリー化+折りたたみ

本BLOGわ、カテゴリ・アーカイブを既にツリー化していたため、
参考にしたサイトに記載されている手順と若干異なる部分がありまつ。

1.Pluginのダウンロード&インスコ

下記リンクより、それぞれのPluginをダウンロード。
≫ArchiveDateHeader Plugin
≫ArchiveDateFooter Plugin

ダウンロードした各Pluginを解凍すると、「ArchiveDateHeader Plugin」わ
「ArchiveDateHeader.pl」というファイルが、「ArchiveDateFooter Plugin」わ
「ArchiveDateFooter」というディレクトリができるので、それぞれを
MTフォルダの下にある「Plugins」フォルダにアップロードしまつ。

MT管理画面の「メイン・メニュー」→「システム・メニュー」→「プラグイン」で
「ArchiveDateFooter Plugin」及び「ArchiveDateHeader.pl」が表示されて
いればオッケーでつ。


2.JavaScriptのダウンロード

menufolder.js をダウンロードし、ソースを若干修正した後に
「index.html」があるフォルダにアップロードするのでつが、
これわアーカイブ・ツリー化ですでに対応済みだったため、
今回わまったくイヂリませんですた。


3.テンプレート修正

「menufolder.js」を取り込むタグの埋め込みや、ツリー画像のアップロードわ、
アーカイブ・ツリー化時に既に埋め込んであったため省略し、月別アーカイブ
部分のみ、下記のように修正しますた。

<!-- 月別アーカイブリスト開始 -->
<div class="sidetitle" id="monthlyname">
Monthly Archives
</div>

<div class="side">
<MTArchiveList archive_type="Monthly" id="monthlylist">
<MTArchiveDateHeader><div id="archive<$MTArchiveDate format="%Y"$>name"><span><$MTArchiveDate format="%Y年"$></span></div><ul id="archive<$MTArchiveDate format="%Y"$>list" class="tree"></MTArchiveDateHeader> <li class="tree<MTArchiveDateFooter>_end</MTArchiveDateFooter>"><a href="<$MTArchiveLink$>"><$MTArchiveDate format="%B月"$></a> [<$MTArchiveCount$>]</li><MTArchiveDateFooter></ul></MTArchiveDateFooter> </MTArchiveList>
</div>

<script type="text/javascript">
//<![CDATA[
<MTArchiveList archive_type="Monthly"><MTArchiveDateHeader>FoldNavigation('archive<$MTArchiveDate format="%Y"$>','off',false);</MTArchiveDateHeader>
</MTArchiveList>
FoldNavigation('monthly','off',false);
//]]>
</script>
<!-- 月別アーカイブリスト終了 -->


4.スタイルシートの修正

スタイルシートも、カテゴリ・アーカイブリストのツリー化時に
修正を行っていたため、今回わ差分のみ追加しますた。

ul.tree li.tree_end {
background-image: url(tree_end_dotted.gif);
list-style: none;
}

参考にしたサイトでわ、ツリー画像を「tree_lst.gif」及び「tree_end.gif」に
リネームすると書かれていたのでつが、カテゴリ・アーカイブのツリー化時に
「tree_lst_dotted.gif」「tree_end_dotted.gif」で対応してしまったので、
今回わ後者のファイル名のまま組み込みました。
(項番4のスタイルシート修正箇所の赤字部分が、オリジナルとわ変えた部分でつ。)