【WordPress】関連記事を表示させる方法（プラグインなし）

2024.11.14

【WordPress】関連記事を表示させる方法（プラグインなし）

WordPressでコラムや実例などを定期的に上げている方は多いと思います。
そして、「人気の記事」や「最新の記事」など入れたりしますよね。
このサイトも例外なく、右サイドに「人気記事」と「最新記事」を入れています。

「人気記事」と「最新記事」とは別に、「関連記事」も表示させたいですよね。

このサイトでは記事の下に「他にもあるよ。関連記事」として表示させています。

今回は関連記事を表示させる方法をご紹介します。

同じカテゴリーから関連記事を取得

functions.php

関連記事を取得するための関数をfunctions.phpに追加します。

PHP
function get_related_posts($post_id, $post_count = 3) {
    $post_categories = wp_get_post_categories($post_id);
    $args = array(
        'category__in' => $post_categories,
        'post__not_in' => array($post_id),
        'posts_per_page' => $post_count,
        'orderby' => 'rand',
        'ignore_sticky_posts' => 1,
    );
    $related_posts = new WP_Query($args);
    return $related_posts;
}

この関数では、$post_idと$post_countという2つの引数を受け取ります。

$post_idは、関連記事を取得する投稿のIDです。
$post_countは、表示する関連記事の数です。

この関数では、$post_idのカテゴリーに属する記事からランダムに$post_countの数だけ記事を取得します。

single.php

次に、投稿ページのテンプレートファイル（single.php）に、関連記事を表示するためのコードを実装します。

PHP
<?php
    $related_posts = get_related_posts($post->ID);
    if ($related_posts->have_posts()) :
?>
    <h3>関連記事</h3>
    <ul>
        <?php while ($related_posts->have_posts()) : $related_posts->the_post(); ?>
            <li><a href="<?php the_permalink(); ?>"><?php the_title(); ?></a></li>
        <?php endwhile; ?>
    </ul>
<?php endif; wp_reset_postdata(); ?>

このコードでは、get_related_posts()関数を呼び出して関連記事を取得し、取得した記事をリスト形式で表示します。
関連記事がある場合は、タイトルとリンクを表示します。関連記事がない場合は、何も表示されません。

同じタグから関連記事を取得

functions.php

PHP
<?php
    $related_posts = get_related_posts($post->ID);
    if ($related_posts->have_posts()) :
?>
    <h3>関連記事</h3>
    <ul>
        <?php while ($related_posts->have_posts()) : $related_posts->the_post(); ?>
            <li><a href="<?php the_permalink(); ?>"><?php the_title(); ?></a></li>
        <?php endwhile; ?>
    </ul>
<?php endif; wp_reset_postdata(); ?>

この関数は、指定された投稿IDのタグを基にして関連記事を取得します。
$post_countには表示する投稿数を指定します。

single.php

PHP
<?php
    $related_posts = get_related_posts_by_tags($post->ID);
    if ($related_posts && $related_posts->have_posts()) :
?>
    <h3>関連記事</h3>
    <ul>
        <?php while ($related_posts->have_posts()) : $related_posts->the_post(); ?>
            <li><a href="<?php the_permalink(); ?>"><?php the_title(); ?></a></li>
        <?php endwhile; ?>
    </ul>
<?php endif; wp_reset_postdata(); ?>

このコードでは、get_related_posts_by_tags()関数を使って関連記事を取得し、リスト形式で表示します。
関連記事が存在する場合のみ表示されるようにしています。

また、リストに画像も入れたい場合は下記の様すると画像も入ります。
（リストの箇所以外は省略しています。）

PHP
    <ul>
        <?php while ($related_posts->have_posts()) : $related_posts->the_post(); ?>
            <li><a href="<?php the_permalink(); ?>"><?php the_post_thumbnail(); ?><?php the_title(); ?></a></li>
        <?php endwhile; ?>
    </ul>

いかがでしょうか。
プラグインなしで、カテゴリーから取得、タグから取得、どちらからでも関連記事を表示させることが出来ます。