今回やりたいことは、
- 「ブログ」カテゴリーだけの月別アーカイブページを表示したい。
- 更に、長年書いてきたブログなので、リストにすると長~い。
サイドバーにドロップダウンで表示したい!
特定のカテゴリーの月別アーカイブを実行
通常、ウィジェットから追加した「月別アーカイブ」では、投稿された全ての記事について、月別にアーカイブされます。
「お知らせ」も「ブログ」も「実績」も、全ての記事がごちゃ混ぜになります。
「ブログ」カテゴリーだけ!
<?php $cat_slug = 'blog'; //アーカイブしたいカテゴリーのスラッグ $args = array( 'category_name' => $cat_slug, 'posts_per_page' => -1 //カテゴリーの記事を全部出力 ); $the_query = new WP_Query( $args ); //上記アーカイブクエリを実行 ?> <?php while ( $the_query->have_posts() ) : $the_query->the_post(); ?> <?php $archive_list[ get_the_time( 'Y/n', $post->ID ) ][] = $post->post_title;//年月ごとに記事情報を格納 ?> <?php endwhile; ?> <?php wp_reset_postdata(); ?>
プルダウンリストの作成
で、ここから、プルダウンリストの作成です。
記事がある月を出力し、option タグで囲みます。
その際、value値に、リンク先となるURLを格納します。
特定のカテゴリーのアーカイブのURLは、
example.com/archives/date/年/月/?cat=カテゴリーID
です。
[<?php echo count( $archive ) ?>] で記事数も表示します。
<?php if( $archive_list ) : ?> <select id="△△△"><!-- △△△は任意の名前:後述のJavaScriptで必要です --> <option>月を選択</option> <?php foreach( $archive_list as $year_month => $archive ) : $year_month_arr = explode( '/', $year_month ); ?> <option value="<?php echo esc_url( home_url( 'archives/date/' .$year_month.'/?cat=カテゴリーID' ) ) ?>"> <!-- 特定のカテゴリーのアーカイブのURLを value に格納 --> <?php echo $year_month_arr[0].'年'.$year_month_arr[1].'月' ?> [<?php echo count( $archive ) ?>] </option> <?php endforeach; ?> </select> <?php endif; ?>
これだけじゃリンクしないよ
option タグにリンクを設定
さて、これだけでは、記事がある月のリストは表示されますが、一覧表示ページにリンクしません。
option タグの value に設定したURLにリンクさせるための、JaveScript を記述します。
<script type="text/javascript"> (function() { var dropdown = document.getElementById( "△△△" ); //selectタグに付与したIDでターゲットのselectタグを取得 function onSelectChange() { if ( dropdown.options[ dropdown.selectedIndex ].value !== '' ) { //optionにvalueが格納されていれば document.location.href = this.options[ this.selectedIndex ].value; //valueの値を location.hrefの値に格納 } } dropdown.onchange = onSelectChange; })(); </script>
特定のカテゴリーだけのアーカイブなので、 JavaScript は、functions.php で wp_enqueue_script関数を使って読み込みます。
その際、出力したいカテゴリーでの条件分岐も忘れずに。
以上です。
補足
特定のカテゴリーの月別アーカイブ一覧、
example.com/archives/date/年/月/?cat=カテゴリーID
の表示は、カテゴリーテンプレートで制御します。
category-スラッグ名.php もしくは、category-カテゴリーID .php を作成します。
if( is_month() ) 関数を使って条件分岐し、通常のカテゴリー一覧の場合の表示と区別することができます。
例えば、タイトル。
<?php if( is_month() ) : //月別アーカイブ一覧だったら、 $date_name = get_query_var('year').'年'.get_query_var('monthnum').'月'; //アーカイブクエリのyearとmonthnumの値を使って○年□月と記述 ?> <h1 class="page-title"><?php single_cat_title(''); ?> アーカイブ:<?php echo $date_name ;?></h1> <?php else : ?> <h1 class="page-title"><?php single_cat_title(''); ?></h1> <?php endif; ?>
結果は、
<!-- 通常のブログカテゴリー表示なら、--> <h1 class="page-title">ブログ</h1> <!-- ブログカテゴリーの2019年6月のアーカイブ表示なら、--> <h1 class="page-title">ブログ アーカイブ:2019年6月</h1>
となります。
特定のカテゴリーの月別アーカイブ実行部分で、下記サイト様を参考にさせていただきました。
参考サイト:株式会社リコネクト様
スタッフブログ:「【WordPress】wp_get_archivesを使わずに特定カテゴリーの年月アーカイブリストを表示したい」
https://www.rcnt.jp/blog/wordpress-wp_get_archives/