wp_list_categories() の投稿数表示を タグの中に入れる方法

wp_list_categories()は、カテゴリーの一覧をリンク付きで表示でき、show_countオプションを設定するとカテゴリー名の横に投稿数を表示できます。しかし、投稿数が<a>タグの外に表示されるため、CSS で見た目を整える際に不都合が生じることがあります。

使用バージョン:WordPress 6.7.2

wp_list_categories() を使用した際に出力される HTML

PHP のソースコード

<?php
wp_list_categories(array(
  'order' => 'DESC',
  'orderby' => 'count',
  'show_count' => true,
  'title_li' => ''
));
?>

実際に表示される HTML

投稿数が、<a>タグの外に出てしまっています。

投稿数を <a> タグの中に入れて出力する方法

結論から言うと、wp_list_categories()を使用して<a>タグの中に投稿数を入れて出力しようとするのは諦めたほうがよいでしょう。

調べてみると、preg_replace()を使用する方法や、wp-includesフォルダ内のコアファイルのクラスを継承してカスタマイズする方法などが出てきますが、WordPress 本体がアップデートされた時に同じように動いてくれるとは限りません。

なので、代わりにget_terms()という関数を使って、投稿数を<a>タグの中に入れて出力させてみましょう。

ちなみに、wp_list_categories()で出力される HTML は、wp-includes/class-walker-category.phpファイル内のWalker_Categoryというクラスで生成されているので、興味のある方は見てみてください

代わりに get_terms() を使用したカテゴリー一覧の表示方法

wp_list_categories()の代わりにget_terms()を使用したリンク付きのカテゴリーの一覧表示です。クラス名などはwp_list_categories()で表示される形式と合わせてみました。

PHP のソースコード

<?php
$terms = get_terms(array(
  'taxonomy' => 'category',
  'order'    => 'DESC',
  'orderby'  => 'count'
));
?>
<?php foreach($terms as $term): ?>
  <li class="cat-item cat-item-<?php echo $term->term_id; ?>"><a href="<?php echo get_term_link($term); ?>"><?php echo $term->name ?> (<?php echo $term->count ?>)</a></li>
<?php endforeach;?>

実際に表示される HTML

投稿数が<a>タグの中に入った状態で出力されるようになりました。

get_terms 関数で使えるオプション

wp_list_categories()で使える一部のオプションは、 get_terms()でも使うことができます。

wp_list_categories() と get_terms() 共通で使えるオプション

  • taxonomy: タクソノミー名。デフォルトは category。
  • child_of: 指定したカテゴリーIDの子カテゴリーのみ表示。
  • order: 並び順。ASC か DESC を指定。デフォルトは ASC。
  • orderby: 並び順の対象となる項目。ID, name, slug, count, term_group など。デフォルトは name。
  • hide_empty: 投稿のないカテゴリーを非表示にするかどうか。0 で表示、1 で非表示。デフォルトは 1。
  • exclude: 除外するカテゴリーの ID をカンマ区切りの文字列か array() で指定。
  • exclude_tree: 除外するカテゴリーの ID をカンマ区切りの文字列か array() で指定。exclude と違う点は、子カテゴリーも一緒に除外される点。

また、get_terms()のみで使えるオプションも豊富に存在します。

get_terms() のみで使えるオプション

  • include: 指定したIDのカテゴリーのみ表示。
  • number: カテゴリーの取得件数。
  • fields: 取得する情報。ids でカテゴリー ID 、names でカテゴリー名のみを配列で取得。count でカテゴリーの数のみを取得。デフォルトは all。
  • name: 取得するカテゴリーの名前を文字列で指定。array() で複数指定も可。
  • slug: 取得するカテゴリーのスラッグを文字列で指定。array() で複数指定も可。
  • search: 指定した文字列でカテゴリーを検索して取得。検索対象は名前とスラッグ。
  • name__like: 指定した文字列でカテゴリーを検索して取得。検索対象は名前のみ。
  • description__like: 指定した文字列でカテゴリーを検索して取得。検索対象は説明のみ。
  • pad_counts: 子カテゴリーの投稿数を親カテゴリーに加算するかどうか。加算する場合は 1 を指定。デフォルトは 0。
  • get: all を指定すると hide_empty と child_of が無効になり、全てのカテゴリーを取得。
  • childless: 子カテゴリーを持たないカテゴリーのみを表示する場合は true を指定。デフォルトは false。