post navigation 前へ次へのリンクをカテゴリー内に限定

シングルポストの前へ次へのポストナビゲーション、これを全投稿ではなくカテゴリー内に限定する話。今更感あり。

「カテゴリー内に限定した前へ次へ」の話です。この話題に懐かしさすら感じます。以前は、previous_post_link() と next_post_link() を使うのが主流で、リファレンスにある通り、’TRUE’ を書き足せばいいだけでした。

テンプレートタグ previous posts link
テンプレートタグ next posts link

WordPress バージョン4くらいでしたか、the_post_navigation 関数が登場して、デフォルトテーマでもこちらが使われるようになりました。

当初、’TRUE’ を書き足す場所がなくてカテゴリー内に限定する方法が判らず、それでthe_post_navigation を使わずに従来の previous_post_link と next_post_link を使うことで簡易な解決としました。そのようにアドバイスする人たちも少なからずいたように思います。

デフォルトテーマのカスタマイズを行うとき、single.phpのポストナビゲーションをいちいち旧来のタグに置き換え、スクリーンリーダーテキストやspanのクラスをテーマに合わせて書き換えることが常態化して、その後何の疑問も抱かずに長年過ごしました。

何の疑問も抱かずにいたものの、テンプレートタグを置き換える煩雑な作業と、自分が書く仕上がりの汚いコードにうんざりしていました。

当時は the_post_navigation の情報も少なかったので仕方ないのですが、今でも少ないです。日本語WordPressのリファレンスには項目もありません。

でも情報自体はすでに出回っていて、英語のリファレンスには書かれています。
Code Refarence the_post_navigation

一度暫定的に決めた処置を情報のアップデートすることなく疑問も抱かず長年そのまま使い続けるのは老害の一種ですね。こうして人間は凝り固まっていきます。それを打開するために the_post_navigation について調べます。・・・少し検索するだけで新しい知見を得ることが出来ました。

カテゴリー内に限定した the_post_navigation

the_post_navigationタグはこのような形で書かれていますね。

the_post_navigation( array(
 'prev_text' => __( 'prev chapter: %title' ),
 'next_text' => __( 'next chapter: %title' ),
 ) );

これに

'in_same_term' => true,

を書き足すだけでいいのでした。さらに、カテゴリーではなくて他のtaxonomy、例えばタグを基準にしたいときは ‘taxonomy’ => __( ‘post_tag’ ), こんなふうに追加します。

twentyseventeen の single.php でしたらこうですね。4行目までがデフォルト、これに5行目と6行目を書き足しています。

the_post_navigation(
    array(
        'prev_text' => '<span class="screen-reader-text">' . __( 'Previous Post', 'twentyseventeen' ) . '</span><span aria-hidden="true" class="nav-subtitle">' . __( 'Previous', 'twentyseventeen' ) . '</span> <span class="nav-title"><span class="nav-title-icon-wrapper">' . twentyseventeen_get_svg( array( 'icon' => 'arrow-left' ) ) . '</span>%title</span>',
        'next_text' => '<span class="screen-reader-text">' . __( 'Next Post', 'twentyseventeen' ) . '</span><span aria-hidden="true" class="nav-subtitle">' . __( 'Next', 'twentyseventeen' ) . '</span> <span class="nav-title">%title<span class="nav-title-icon-wrapper">' . twentyseventeen_get_svg( array( 'icon' => 'arrow-right' ) ) . '</span></span>',
        'in_same_term' => true,
        'taxonomy' => 'category',
    )
);