【WordPress】wp_list_categoriesにクラスを付与したり指定表示したり除外したりする方法
カテゴリリスト(タームの一覧)を表示するテンプレートタグ wp_list_categories の使い方の解説です。
カテゴリのリンク付きリストとスラッグ付きクラスを付与する方法です。
wp_list_categoriesの使い方
「投稿」のカテゴリリストの表示
<?php wp_list_categories(); ?>
ですがテンプレートタグをそのまま貼り付けるだけだと以下のようなおかしなHTMLが書き出されてしまいます。
<ul>
<li class="categories">カテゴリー<ul> <li class="cat-item cat-item-ID"><a href="">未分類</a>
</li>
<li class="cat-item cat-item-ID"><a href="">未分類2</a>
</li>
</ul></li> </ul>
最初の<ul><li class="categories">カテゴリー<ul>
と
最後の</li> </ul>
が余分ですね。
そこでtitle_li
というパラメータを加えて下記のようにすると余分なHTMLタグが無くなりスッキリします。
正確には無くなるのではなく、title_liで、最初の<ul><li class=”categories”>カテゴリー<ul>の部分を書き換えています。
'title_li='
のように空の値を設定する事で、何も書き出さないようにしています。
ただ、これだとulの部分も消えてしまうのでテンプレートタグをulで囲みます。
<ul>
<?php wp_list_categories('title_li='); ?>
</ul>
タクソノミーのターム一覧を表示する方法
タクソノミーのターム一覧を表示するにはパラメータにタクソノミーを指定します。
タクソノミーが「category_cat」の場合
<?php wp_list_categories('title_li=&taxonomy=category_cat'); ?>
ターム毎にクラスを付与する方法
functions.phpに以下のコードを追記します。
3行目'category_cat'
となっている部分でタクソノミーを指定しています。
function add_cat_slug_class( $output, $args ) {
$regex = '/<li class="cat-item cat-item-([\d]+)[^"]*">/';
$taxonomy = isset( $args['taxonomy'] ) && taxonomy_exists( $args['taxonomy'] ) ? $args['taxonomy'] : 'category_cat';
preg_match_all( $regex, $output, $m );
if ( ! empty( $m[1] ) ) {
$replace = array();
foreach ( $m[1] as $term_id ) {
$term = get_term( $term_id, $taxonomy );
if ( $term && ! is_wp_error( $term ) ) {
$replace['/<li class="cat-item cat-item-' . $term_id . '("| )/'] = '<li class="cat-item cat-item-' . $term_id . ' cat-item-' . esc_attr( $term->slug ) . '$1';
}
}
$output = preg_replace( array_keys( $replace ), $replace, $output );
}
return $output;
}
add_filter( 'wp_list_categories', 'add_cat_slug_class', 10, 2 );
出力結果
HTMLは以下のようにliタグに cat-item-ターム名
というクラスが付与されます。
<ul>
<li class="cat-item cat-item-2 cat-item-ターム1"><a href="">記事1</a>
</li>
<li class="cat-item cat-item-3 cat-item-ターム2"><a href="">記事2</a>
</li>
<li class="cat-item cat-item-4 cat-item-ターム3"><a href="">記事3</a>
</li>
</ul>
特定のタームを指定して表示・除外する方法
特定のタームだけを表示したり非表示にしたりするには、タームのIDをパラメータで指定します。
指定して表示 | include=* |
---|---|
指定して除外 | exclude=* |
IDが6のタームを除外する場合
<?php wp_list_categories('title_li=&taxonomy=categories_cat&exclude=6'); ?>
タームIDの確認方法
管理画面ターム一覧でターム名にカーソルを合わせるとブラウザの下の方にURLが表示されます。
その中の
tag_ID=**
の部分です。
参考