‘デフォルト’ カテゴリーのアーカイブ

カテゴリーをプルダウンにする

2009 年 1 月 21 日 水曜日

/***************************************
file Name: list.js
URI: http://blog.lunatic-code.net
Description: wordpressのカテゴリをドロップダウンリストにする
Version: 1.0
Author: mick
Author URI: http://blog.lunatic-code.net

サイドバー書式
<div id="sidebar">
<ul>
<?php wp_list_categories(‘orderby=ID&show_count=True&exclude=1′); ?>
</ul>
</div>

// header.php 追記事項

<?php wp_head(); ?>の前に<?php wp_enqueue_script(‘jquery’); ?>を追加
<?php wp_head(); ?>の後ろに<script src="<?php bloginfo(‘stylesheet_directory’); ?>/js/list.js" type="text/javascript" charset="utf-8"></script>
を追加

<?php wp_enqueue_script(‘jquery’); ?>
<?php wp_head(); ?>
<script src="<?php bloginfo(‘stylesheet_directory’); ?>/js/list.js" type="text/javascript" charset="utf-8"></script>

***************************************/

/***************************************
listToSelect
***************************************/

// グローバル
var childList = [];

// 親カテゴリ
function listToSelect(id){
var elm = [];
var title =’カテゴリ選択’;
jQuery(id+">ul:not([class='children'])>li>a").each(
function(i){
elm[i]=jQuery(this);
});
var ct=’<form>’+"\n"+
‘ <select onChange="viewChildLists(\”+id+’\',value);">’+"\n"+
‘ <option value="#">’+title+’</option>’+"\n";
jQuery(elm).each(
function(i){
ct += ‘<option value="’+i+’">’+
jQuery(elm[i]).text()+
‘</option>’+"\n";
}
);
ct +=’</select>’+"\n";
ct +=’</form>’+"\n";
jQuery(id+" ul").replaceWith(ct);
}

// 子カテゴリ
function createChildLists(id){
var parent = [];
var child =[];
var ct=[];

// 親カテゴリのタイトルとURL取得
jQuery(id+">ul:not([class='children'])>li>a").each(
function(p){
parent[p] = new Array();
parent[p]["href"]=jQuery(this).attr("href");
parent[p]["title"]=jQuery(this).text();;
});

// 子カテゴリ取得
for(j=0; j<jQuery(id+">ul:not([class='children'])>li").length; j++){
child[j] = new Array();
jQuery(id+">ul:not([class='children'])>li:eq("+j+")>ul.children>li>a").each(
function(i){
child[j][i]=jQuery(this);
});
}
// 子カテゴリ配列をグローバル変数へ入れる
for(j=0; j<jQuery(id+">ul:not([class='children'])>li>a").length; j++){
childList[j] = new Array();

// 子カテゴリがないときの為に親カテゴリを入れておく
childList[j][0] = new Array();
childList[j][0]["href"]=parent[j]["href"];
childList[j][0]["title"]=parent[j]["title"];

// 子カテゴリのタイトルとURL設定
jQuery(child[j]).each(
function(i){
childList[j][i+1] = new Array();
childList[j][i+1]["href"]=jQuery(child[j][i]).attr("href");
childList[j][i+1]["title"]=jQuery(child[j][i]).text();
}
);
}

}
// 子プルダウン表示
function viewChildLists(id,value){
jQuery(id +" .childList").remove();
var ct;
ct=’<form class="childList">’+"\n"+
‘ <select id="child_’+ value +’">’+"\n";
for(j=0; j< childList[value].length; j++){
ct += ‘<option value="’+
childList[value][j]["href"]+
‘">’+
childList[value][j]["title"]
‘</option>’+"\n";
}
ct +=’</select>’+"\n";
ct +=’<input type="button" value="移動" onClick="JavaScript: location.href=this.form.child_’+ value +’.value; return false;" />’;
ct +=’</form>’+"\n";
jQuery(id).append(ct);
}

jQuery(document).ready(function() {
createChildLists(".categories");
listToSelect(".categories");
});