ウェブデザイナーのお仕事のメモ - mainichi web まいにちウェブ

twitter

作成日:2022.04.27  最終更新日:2022.04.27

wordpress

WordPressで前の記事へ、次の記事へのリンクを表示する

WordPressの投稿記事ページに、次の記事へ、前の記事へ、のリンクを表示するためのメモです。

一番基本の前の記事へ、次の記事へのリンク

PHP

基本の前の記事へリンクの表示方法は以下の通りです。

<?php previous_post_link(); ?>

基本の次の記事へリンクの表示方法は以下の通りです。

<?php next_post_link(); ?>

また、上記コードを書くと以下のようなHTMLが出力されます。

<a href="前の記事のリンク" rel="prev">前の記事のタイトル</a>
<a href="次の記事のリンク" rel="next">次の記事のタイトル</a>

☆各タグと各オプションの説明

以下タグで、現在の投稿の前の記事、次の記事を表示することができます。

//前の記事
<?php previous_post_link( $format, $link, $in_same_term, $excluded_terms, $taxonomy ); ?>
//次の記事
<?php next_post_link( $format, $link, $in_same_term, $excluded_terms, $taxonomy ); ?>

以下で、各オプションの説明をします。

各オプションの説明

$format

リンクの文字列の書式を設定します。そして、この文字列に任意の文字を追加することで、リンクの前後に追加する文字を設定できます。

$link

リンク部分に表示されるテキストを設定できます。

$in_same_term

次の記事、前の記事を、現在表示している投稿と同じタクソノミー・ターム(カテゴリー)の投稿に限定するかどうかを、true、falseで設定します。初期値はfalseになっています。

$excluded_terms

表示させたくない投稿のターム ID(カテゴリー ID)を設定できます。

$taxonomy

$in_same_termをtrueにしている時に設定できるオプションです。表示したいタクソノミー名を設定します。初期値は、'category'となっています。

実際の使い方は以下にいくつかメモしています。

【応用】表示されるテキストを投稿タイトルを使わず任意の文字に変更して表示する

基本の書き方だと、リンクに表示されるテキストは記事のタイトルになっていますが、以下のように書くと任意の文字に変えることもできます。

PHP

前の記事へのリンクのテキストを任意で変更する場合の書き方は以下の通りです。

<?php previous_post_link('%link', 'Previous post'); ?>

次のの記事へのリンクのテキストを任意で変更する場合の書き方は以下の通りです。

<?php next_post_link( '%link', 'Next post'); ?>

また、上記コードを書くと以下のようなHTMLが出力されます。

<a href="前の記事のリンク" rel="prev">Previous post</a>
<a href="次の記事のリンク" rel="next">Next post</a>

【応用】同じカテゴリー内の前の記事、次の記事のリンクを表示する

同じカテゴリ内の前の記事、次の記事のリンクを表示する書き方は以下の通りです。

PHP

同じカテゴリー内の前の記事へのリンクを表示させる書き方は以下の通りです。

<?php previous_post_link('%link', '%title', TURE); ?>

同じカテゴリー内の次の記事へのリンクを表示させる書き方は以下の通りです。

<?php next_post_link('%link', '%title', TURE); ?>

【応用】前の記事、次の記事がない場合はリンクを表示しない

前の記事、次の記事が存在しない場合はリンクを表示しない書き方は以下の通りです。

<?php
$previous_post = get_previous_post();
$next_post = get_next_post();
if($previous_post | $next_post):
?>
<div class="article-nav">
<?php if ($previous_post):?>
 <p class="prev"><?php previous_post_link('%link', '前の記事へ'); ?></p>
<?php endif; ?>
<?php if ($next_post):?>
 <p class="next"><?php next_post_link('%link', '次の記事へ'); ?></p>
<?php endif; ?>
</div>
<?php endif;?>

Ranking

まだデータがありません。