WordPressのブログ記事に「前の記事へ」と「次の記事へ」のリンクを設置する
こんにちは、福岡のホームページ制作シンス株式会社の越水です。
WordPressで制作したホームページのブログ記事に、前後のページへのリンクを設置する方法を紹介します。
前の記事や次の記事へのリンクを設置することで、Webサイトの訪問者に別ページも見てもらうきっかけを与えることができ、直帰率の低下にも繋がります。
目次
今読んでいる記事の前後ページへのリンクはWordPressが勝手に生成してくれる!
WordPressならば便利なテンプレートタグが用意されているので前後の記事へのリンクを作る場合も簡単です。
テンプレートタグprevious_post_linkとnext_post_linkを使う
前の記事へのリンクを作るときはprevious_post_link、次の記事へのリンクを作りたい場合はnext_post_linkというテンプレートタグを使うことで、簡単にリンクの設置ができます。
WordPressのテンプレートファイルに書く時は次のように書きましょう。
今回の場合は主にsingle.phpに書くことになると思います。
1 2 3 4 5 6 | //基本的な書き方 <?php previous_post_link(); ?> // 前の記事へのリンク <?php next_post_link(); ?> // 次の記事へのリンク //引数を用いた書き方 <?php previous_post_link('« %link', '%title', TRUE, '1,2'); ?> <?php next_post_link('%link »', '%title', TRUE, '1,2'); ?> |
previous_post_linkとnext_post_linkはそれぞれいくつかの引数を設定できます。
ここではよく使う引数だけ説明をしたいと思います。より詳しい内容はWordPress Codexを確認してください。
引数1:リンクフォーマットの設定
1つ目の引数では、リンクの書式を設定することが出来ます。
リンクの前後に特定の文字や矢印をつけたい時にはこの引数へ設定します。リンク自体は%linkで表すことができます。
引数2:リンクテキストの設定
リンクに使用するテキストを設定することが出来ます。
デフォルトでは%titleが設定されており、記事タイトルを表示するようになっています。
任意のテキストに置き換えることで、好きな文言でリンクを作成することができます。
引数3:同じカテゴリー記事に限定するかどうか
3つ目の引数によって、リンク対象の記事を今見ている記事と同じカテゴリーに限定するかを設定します。
デフォルトはfalseになっていますが、これをtrueにすることで同じカテゴリー内の記事だけにリンクが作られるようになります。
引数4:除外カテゴリーの設定
リンク生成の際に除外したいカテゴリーがある場合は4つ目の引数で設定します。
表示させたくないカテゴリーのID番号を設定しましょう。
複数ある場合は配列にするか、IDをカンマで区切って書きましょう。
上記のソースコードの場合はIDが1と2のカテゴリーが除外されるようになっています。
前後の記事があるかどうか判定してリンクを作る
少し発展させたパターンとして、前後の記事が存在するときだけテンプレートタグ以外のhtmlタグも含めて表示・非表示を分岐させるコードを載せておきます。
1 2 3 4 5 6 7 8 9 10 | <div class="paging"> <?php if (get_next_post()):?> // 次の記事がある場合にリンクを表示 <div class="next"><?php next_post_link('%link','%title',TRUE); ?></div> <?php endif; ?> <?php if (get_previous_post()):?> // 前の記事がある場合にリンクを表示 <div class="prev"><?php previous_post_link('%link','%title',TRUE); ?></div> <?php endif; ?> </div> |
この方法を使えば、記事が存在しない時はそれに関わる記述もまるっと出力しないようにできます。
参考URL
テンプレートタグ/next post link テンプレートタグ/previous post link
ホームページ制作だけでなくアクセス解析、SNSやブログの運用アドバイスなど様々なWebマーケティングのご相談も承ります。