WordPressで「前の記事」「次の記事」リンクに任意のclassを付ける方法
edit投稿日
update更新日
こんにちは、webエンジニアのゾノ( @ozonosho )です。
さて、今回の記事ではWordPressで「前の記事」「次の記事」リンクに任意のclassを付ける方法を紹介したいと思います。
WordPressでは記事ページ（single.php）に「前の記事」と「次の記事」のナビゲーションを追加するための関数が用意されているのですが、この関数を利用して出力されるリンクにはclassやidがついていないのでCSSを設定するときに少し不便なんですよね。
WordPressで「前の記事」「次の記事」リンクに任意のclassを付ける方法
実装は簡単です。下記のようなコードをfunctions.phpに追加してあげればOKです。
//前の記事・次の記事のリンクにclassを付与する
function add_prev_post_link_class($output) {
return str_replace('
前の記事リンクや次の記事リンクを出力する際に値を変更するためのフィルターフックが用意されているので、aタグを置換してクラス名を追加しています。
上記のソースでは「prev-link」「next-link」というクラス名を割り振っていますが、好きな名前を付けていただいて大丈夫です。
おわりに
以上、今回の記事ではWordPressで「前の記事」「次の記事」リンクに任意のclassを付ける方法を紹介させていただきました。
つくりばのことが気になりましたか？
つくりばは、ココトモ・未来地図を自社で10年以上運営してきた知見をもとに、相談・コミュニティの開発と運営を支援しています。いきなりのご相談でなくて大丈夫です。まずは私たちの実績や考え方をご覧ください。
つくりばについて知る
