サイドバーのカテゴリー…サブカテゴリーを使ってるとリスト表示では見難いなぁ~と思ってたの(>_<)
リストマークを変更したりもしたけど、やっぱり見難いなぁ~って(-_-;)
小粋空間さまでカテゴリーをツリー化する方法が紹介されてて、それ見た時、これなら見易いかも!!って思った★
なので早速サイドメニューのツリー化スクリプト(改)を参考にやってみたー(*^_^*)
以下、覚書。
1.まずは小粋空間さまで maketree.js をDLしてきて、サーバーにアップロード! (ブログのある場所でOKだと思いますー。)
2.うちはサブカテゴリーを利用してるのでMTタグの修正はなく、以下の赤部分を追加するだけでOKでした★
<div class="sidetitle">
カテゴリ
</div>
<div class="side">
<div id="categories">
<MTSubCategories>
<MTSubCatIsFirst><ul></MTSubCatIsFirst>
<MTIfNonZero tag="MTCategoryCount">
<li><a href="<$MTCategoryArchiveLink$>" title="<$MTCategoryDescription$>"><$MTCategoryDescription$></a> [<$MTCategoryCount$>]
<MTElse>
<li><$MTCategoryDescription$>
</MTElse>
</MTIfNonZero>
<MTSubCatsRecurse max_depth="3">
</li>
<MTSubCatIsLast></ul></MTSubCatIsLast>
</MTSubCategories>
</div>
</div>
<script type="text/javascript" language="javascript">
<!--
generateSubcategoryTree();
//-->
</script>
*注*<div id="categories">のid名を変更してる場合は、maketree.jsの記述も変更しなければいけないみたいです!
3.各テンプレートの<head>~</head>間に下記を追加。
<script language="JavaScript" type="text/javascript" src="<$MTBlogURL$>maketree.js" charset="utf-8"></script>
4.小粋空間さまから画像をDLしてきて、サーバーにアップロードする。
5.スタイルシートに下記を追加。(.sideの下あたりに。)
ul.tree {
margin: 0px!important;
padding: 0px!important;
font-size: 9px;
list-style: none!important;
}
ul.tree ul {
margin: 0px!important;
padding: 0px!important;
}
ul.tree li {
margin: 0px!important;
padding: 0px 0px 0px 16px!important;
background-image: url(http://***/**/img/tree_lst.gif);
background-repeat: no-repeat!important;
list-style: none!important;
}
ul.tree li.end {
background-image: url(http://***/**/img/tree_end.gif);
list-style: none;
}
*注*画像名は保存した名前で書くコト。あとうちは画像をimgディレクトリ内に入れたのでurlは画像の置いてるURLを書きました。
6.あとは再構築して、終了!!
・・・多分、これで出来るはずなんだけど・・・どういうわけかうまく表示されない(T_T)
月別と日別アーカイブはちゃんと表示されてるんだけど、メインと個別アーカイブはなぜかカコログがツリー化されてるの(/_;)
カテゴリーアーカイブにいたっては全くツリー化されておらず(>_<)
何がダメなんだろー???ちょっと検討しなければ。。。
[追記:2005/02/13 01:39]
無事、解決した~ヾ(≧∇≦*) 詳しくはコチラ。




>yujiroさん
こんばんは★
コメントしてくださって、どうもありがとうございます(*^_^*)
以前のリスト表示に比べて、本当にツリー表示は見やすくて感動的です♪
これは自画自賛しちゃって、構わないですよ~ヾ(≧∇≦*)
こんな素敵なスクリプトを作ってくださって、本当にありがとうございます!!!
こんにちは。
こちらにもコメントさせて頂きました。
ということで、ご利用ありがとうございます!
ツリーは見やすくていいですよね~(自画自賛)。