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 を参考に色々と試してみてください。
参考サイト
jQueryでURLに特定の文字(#contentなどの文字)を足す