wp_list_categoriesで色々なカスタマイズをしてみた

wp_list_categoriesで色々なカスタマイズをしてみた

テンプレートタグ「wp_list_categories」を使ってカテゴリーリストを出力する際にカスタマイズすることが多く、毎回調べているのでよく使うカスタマイズを自分なりにまとめてみました。

wp_list_categoriesの使い方

wp_list_categoriesの使い方ですが

<?php wp_list_categories( $args ); ?>

となります。$argsの中に指定したいパラメーターを書いていきます。指定したいパラメーターが複数ある場合は&で繋ぎます。wp_list_categoriesをパラメーターなしでデフォルトの状態で出力すると

<li class="categories">カテゴリー
  <ul>
    <li class="cat-item cat-item-ID"><a href="http://~/" title="カテゴリの説明">カテゴリ1</a></li>
	  <li class="cat-item cat-item-ID"><a href="http://~/" title="カテゴリの説明">カテゴリ2</a>
      <ul class='children'>
        <li class="cat-item cat-item-ID"><a href="http://~/" title="カテゴリの説明">カテゴリ2-1</a></li>
      </ul>
    </li>
  </ul>
</li>

上記の形で出力されます。cat-item-IDのID部分はカテゴリのIDが入ります。またtitle="カテゴリの説明"はカテゴリの説明を設定してない場合は出力されません。

カテゴリーリストの見出しを非表示にする

デフォルトだと先頭に <li class="categories">カテゴリー が出力されますが、これを出力しない方法です。パラメーターtitle_liを空にします。

<?php wp_list_categories('title_li='); ?>

出力結果

<li class="cat-item cat-item-4"><a href="http://~/" title="カテゴリの説明">カテゴリ1</a></li>
<li class="cat-item cat-item-2"><a href="http://~/" title="カテゴリの説明">カテゴリ2</a>
  <ul class='children'>
    <li class="cat-item cat-item-5"><a href="http://~/" title="カテゴリの説明">カテゴリ2-1</a></li>
  </ul>
</li>

タイトルを非表示にするとタイトル直後の<ul></ul>が出力されなくなります。

カテゴリーリストの見出しを変更する

今度は見出しを変更する場合です。先ほどのパラメーターtitle_liの値を変更します。タグをh2、文字をテストに変更してみます。

<?php wp_list_categories('title_li=<h2>'.__('テスト').'</h2>'); ?>

出力結果

<li class="categories">
  <h2>テスト</h2>
    <ul>
      <li class="cat-item cat-item-4"><a href="http://~/" title="カテゴリの説明">カテゴリ1</a></li>
      <li class="cat-item cat-item-2"><a href="http://~/" title="カテゴリの説明">カテゴリ2</a>
        <ul class='children'>
          <li class="cat-item cat-item-5"><a href="http://~/" title="カテゴリの説明">カテゴリ2-1</a></li>
        </ul>
      </li>
    </ul>
</li>

特定カテゴリーを表示する

特定カテゴリーのみ表示する場合はパラメーターincludeを使います。複数指定したい場合は,で区切ります。例としてカテゴリーID4,2を指定してみます。ここからはカテゴリーリストの見出しを非表示にします。

<?php wp_list_categories('title_li=&include=4,2'); ?>

出力結果

<li class="cat-item cat-item-4"><a href="http://~/" title="カテゴリの説明">カテゴリ1</a></li>
<li class="cat-item cat-item-2"><a href="http://~/" title="カテゴリの説明">カテゴリ2</a></li>

特定カテゴリーを非表示にする

特定カテゴリーを非表示にする場合はパラメーターexcludeを使います。例としてカテゴリーID4を指定してみます。

<?php wp_list_categories('title_li=&exclude=4'); ?>

出力結果

<li class="cat-item cat-item-2"><a href="http://~/" title="カテゴリの説明">カテゴリ2</a>
  <ul class='children'>
    <li class="cat-item cat-item-5"><a href="http://~/" title="カテゴリの説明">カテゴリ2-1</a></li>
  </ul>
</li>

表示する階層を指定する

表示する階層を指定するにはパラメーターdepthを使います。デフォルトでは0(全ての親カテゴリーを出力)になってます。例として1(最上位のカテゴリーのみ表示)を指定しています。

<?php wp_list_categories('title_li=&depth=1'); ?>

出力結果

<li class="cat-item cat-item-4"><a href="http://~/" title="カテゴリの説明">カテゴリ1</a></li>
<li class="cat-item cat-item-2"><a href="http://~/" title="カテゴリの説明">カテゴリ2</a></li>

カテゴリーリストの投稿件数を表示する

投稿件数を表示するにはパラメーターshow_countを使います。表示する場合は1、非表示の場合は0を指定します。デフォルトは0です。

<?php wp_list_categories('title_li=&show_count=1'); ?>

出力結果

<li class="cat-item cat-item-4"><a href="http://~/" title="カテゴリの説明">カテゴリ1</a> (70)</li>
<li class="cat-item cat-item-2"><a href="http://~/" title="カテゴリの説明">カテゴリ2</a> (6)
  <ul class='children'>
    <li class="cat-item cat-item-5"><a href="http://~/" title="カテゴリの説明">カテゴリ2-1</a> (2)</li>
  </ul>
</li>

投稿件数を表示した際に括弧を非表示にする

パラメーターshow_countを使って投稿件数を表示すると自動的に括弧で括られますがstr_replaceを使って括弧を空に置き換えます。

<?php
$variable = wp_list_categories('echo=0&show_count=1&title_li=');
$variable = str_replace(array('(',')'), '', $variable);
echo $variable;
?>

出力結果

<li class="cat-item cat-item-4"><a href="http://~/" title="カテゴリの説明">カテゴリ1</a> 70</li>
<li class="cat-item cat-item-2"><a href="http://~/" title="カテゴリの説明">カテゴリ2</a> 6
  <ul class='children'>
    <li class="cat-item cat-item-5"><a href="http://~/" title="カテゴリの説明">カテゴリ2-1</a> 2</li>
  </ul>
</li>

カテゴリーリストの表示順を変更する

カテゴリーリストの表示順を変更する場合はパラメーターorderbyを使います。orderbyに以下の何かを指定します。

  • ・ID カテゴリーID順
  • ・name カテゴリー名のアルファベット順(デフォルト)
  • ・slug スラッグ順
  • ・count 投稿数順
  • ・term_group グループID順
<?php wp_list_categories('title_li=&orderby=name'); ?>

出力結果

<li class="cat-item cat-item-4"><a href="http://~/" title="カテゴリの説明">カテゴリ1</a></li>
<li class="cat-item cat-item-2"><a href="http://~/" title="カテゴリの説明">カテゴリ2</a>
  <ul class='children'>
    <li class="cat-item cat-item-5"><a href="http://~/" title="カテゴリの説明">カテゴリ2-1</a></li>
  </ul>
</li>

カテゴリーリストの並び順を変更する

カテゴリーリストの並び順を変更する場合はパラメーターorderを使います。ASC(昇順)・DESC(降順)を指定できます。デフォルトはASC(昇順)です。

<?php wp_list_categories('title_li=&order=DESC'); ?>

出力結果

<li class="cat-item cat-item-2"><a href="http://~/" title="カテゴリの説明">カテゴリ2</a>
  <ul class='children'>
    <li class="cat-item cat-item-5"><a href="http://~/" title="カテゴリの説明">カテゴリ2-1</a></li>
  </ul>
</li>
<li class="cat-item cat-item-4"><a href="http://~/" title="カテゴリの説明">カテゴリ1</a></li>

まとめ

wp_list_categoriesはカテゴリーリストを作るときに使いますが、パラメーターをなかなか覚えられずいつもCodexで調べていたので少しでも時間短縮になればと思いまとめてみました!

シェアする

コメント

おすすめの関連記事