WP ビッグフッターにカテゴリーリストを複数列で表示させるTips〜サイトを2カラム仕様に戻しました

"WordPress" カテゴリー記事
  

サイトを2カラム仕様に変更しました。3年ほど前に2カラム仕様のサイトを3カラムに改造して使っていましたが、いまいち使い勝手がよろしくない。
というより明確な使用目的があったワケでもなくとりあえず3カラムに改造してみようだったので、あれこれ後付けで考えて試してみても旨くいくはずもなくかえって管理しにくい、書きにくいシロモノでした。

元々サイドバーに設置してあった”カテゴリーリスト”、プルダウン形式のボタンを設置しようかとも思いましたが、フッターに置くことにしました。
詰め詰めにずらずらと並べるのも芸がないと思い、ちゃんと複数列で整列配置させたいとTipsを探すと見つかりました。(WP Forum:2 or 3 column categories in sidebar)

<?php
// Grab the categories - top level only (depth=1)
$get_cats = wp_list_categories( 'echo=0&title_li=&depth=1&hide_empty=0' );
// Split into array items
$cat_array = explode('</li>',$get_cats);
// Amount of categories (count of items in array)
$results_total = count($cat_array);
// How many categories to show per list (round up total divided by 3)
$cats_per_list = ceil($results_total / 3);
// Counter number for tagging onto each list
$list_number = 1;
// Set the category result counter to zero
$result_number = 0;
?>
<ul class="cat_col" id="cat-col-<?php echo $list_number; ?>">
<?php
foreach($cat_array as $category) {
	$result_number++;

	if($result_number % $cats_per_list == 0) {
		$list_number++;
		echo $category.'</li>
		</ul>
		<ul class="cat_col" id="cat-col-'.$list_number.'">';
	}
	else {
		echo $category.'</li>';
	}
}
?>
</ul>
<!--
/* All UL elements */
.cat_col {
	width:200px;
	float:left;
	display:block;
	padding:0;
	margin:0 5px 0 0;
	overflow:hidden;
}
	/* All LI elements */
	.cat_col li {
		clear:left;
		display:block;
		padding:8px;
		margin:1px 0 0 0;
		width:200px;
	}

#cat-col-1 {
	/* CSS for first list only */
}
#cat-col-2 {
	/* CSS for second list only */
}
#cat-col-3 {
	/* CSS for third list only */
}
-->

 

子カテゴリー構造だと旨く表示させるのが難しいので、従来のカテゴリーを全て親カテゴリー無し変更してフッター部分に設置しました。

”カテゴリー別投稿数を表示させる”のと”表示させないカテゴリー”を設定するため3行目を書き換えています。

$get_cats = wp_list_categories( 'echo=0&title_li=&exclude=10,22&show_count=1&depth=1&hide_empty=0' );

「&exclude=10,22:カテゴリーID10,22を表示しない」
「&show_count=1:カテゴリーに含まれる投稿数を表示」

// How many categories to show per list (round up total divided by 3)
$cats_per_list = ceil($results_total / 3);

 任意の列数で表示させられます。

 

 

コメントを残す