カテゴリー毎の日付別アーカイブを表示する方法

カスタマイズ, ,
WordPressカテゴリー

WordPress には日付別アーカイブリストを表示してくれる便利なテンプレートタグ wp_get_archives() がありますが、カテゴリー毎の日付別アーカイブリストにするオプションがありません。
そこで、今回は jQuery を利用して、簡単にカテゴリー毎の日付別アーカイブにする方法をご紹介します。

もくじ

検索クエリを利用する

今回のやり方はいたって簡単で、検索クエリを利用します。

WordPressでサイト内検索をすると、URLの最後が ?s=〇〇 (〇〇は入力したキーワード)となりますよね。
これがカテゴリの絞り込み条件を追加して検索をすると ?s=〇〇&cat=1 となります。この cat=〇 は カテゴリーID を指定しています。

 

例えばこのサイトなら、2017年3月のアーカイブURLはこうですが

http://taneakashi.ad-mk.com/tane/2017/03

カテゴリ『WordPress』の ID は 11 ですので、URL に ?cat=11 を追加すると

http://taneakashi.ad-mk.com/tane/2017/03?cat=11

2017年3月に投稿した『WordPress』カテゴリの記事だけが一覧表示されます。

jQuery でリンクURLに検索クエリを追加する

wp_get_archives() で生成されたリンクURLの最後に、カテゴリ別の検索クエリを追加すれば、特定カテゴリーの日付別アーカイブの完成です。

詳細はこちら:テンプレートタグ/wp get archives

アーカイブリンクの表示

<ul class="archive-links">
 <?php
  // この 12 ヵ月の月別アーカイブリスト。
  wp_get_archives( 'type=monthly&limit=12' );
 ?>
</ul>

アーカイブリンクを表示した後に下記を記述します。
.acchive-links 内の aタグ の最後に、?cat= を追加する内容になっています。

<script>

jQuery( function() {
  jQuery( ".archive-links a" ).each( function() {
    var obj = jQuery(this);
    var link = obj.attr("href");
    obj.attr("href",link+"?cat=11") //絞り込みたいカテゴリIDを指定してください
  });
});

</script>

参考:jQueryでURLに特定の文字(#contentなどの文字)を足す

 

以上で、カテゴリー毎の日付別アーカイブを表示するリンクが用意できました。

複数カテゴリで絞り込む場合は ?cat=1,2,3 とすることで可能になります。

検索クエリのパラメータは、関数リファレンス/WP Query を参考に色々と試してみてください。

参考サイト

テンプレートタグ/wp get archives

関数リファレンス/WP Query

jQueryでURLに特定の文字(#contentなどの文字)を足す