サイドバーに表示させる記事カテゴリー(コンテンツ)メニューをサブカテゴリー化して簡単に分類表示する方法。
1. 記事カテゴリ名を、「大カテゴリ名>サブカテゴリ名」にする(>は全角)
並び順も微調整。
2. [デザイン]→[コンテンツ]→[カテゴリ]を表示。
「挿入テキスト(下部)」にスクリプトをコピペする。
※この方法だと、HTMLの追加をする必要はありません。
しかも高速表示
3. 再構築して完成。
///で囲まれた部分を書き換える。
tree("カテゴリのタイトル","カテゴリがあるのは右サイドバーか左サイドバーか");
例)カテゴリのタイトルが「目次」で右サイドバーにある場合
tree("目次","右");
と書き換える。
<SCRIPT language="JavaScript">
<!--
/////////////////////////////////////////////////////////
tree("カテゴリ","左"); //←この行を変更する
/////////////////////////////////////////////////////////
function tree(title,position)
{
var category=new Array();
var subcategory=new Array();
category[0]=null; subcategory[0]=null;
if(position=="左"){
position="links-left";
}else if(position=="右"){
position="links";
}else{
return;
}
var tmp=document.getElementById(position).getElementsByTagName('div');
for(var i=0;i<tmp.length;i++){
if(tmp[i].innerHTML==title) break;
}
if(i==tmp.length) return;
var target=tmp[i+1];
var tmp2=target.getElementsByTagName('a');
for(var j=0;j<tmp2.length;j++){
var link=tmp2[j].innerHTML;
if(tmp2[j].innerHTML.indexOf(">")==-1){
category[j+1]="<a href="+tmp2[j].getAttribute('href')+">"+ link+"</a>";
subcategory[j+1]=null;
}else{
category[j+1]=link.substring(0,link.indexOf(">"));
subcategory[j+1]="<a href="+tmp2[j].getAttribute('href')+">"
+link.substring(link.indexOf(">")+1,link.length)+"</a>";
}
}
category[j+1]=null; subcategory[j+1]=null;
//出力
var tmpHTML="<br>";
for(i=1;i<(category.length-1);i++){
if(subcategory[i]==null){
tmpHTML+=("■ "+category[i]+"<br><br>");
}else{
if(category[i]!=category[i-1]) tmpHTML+=("■ "+category[i]+"<br>");
if(category[i]==category[i+1]){
tmpHTML+=("├"+subcategory[i]+"<br>");
}else{
tmpHTML+=("└"+subcategory[i]+"<br><br>");
}
}
}
target.innerHTML=tmpHTML;
}
// -->
</SCRIPT>
参考:
Des notes de KOHtan
・カテゴリの分類とツリー化2
・カテゴリのツリー化(サブカテゴリ化)3
上記のサイトを読めば簡単にできるのだが、備忘録として引用させていただきます。
んー?( ̄ー ̄;)
・カテゴリのツリー化(seesaa)をスピードアップ
発案者に感謝。
みなさんはどう思いますか?
