WordPressの記事ページで関連する記事一覧を実装する方法をプラグインなしで解説！

<div class="single__detail__box__left__box__related">
    <div class="single__detail__box__left__box__related__box">
        <h2 class="single__detail__box__left__box__related__box__title">
        関連する記事
        </h2>
    </div>
    <ul class="single__detail__box__left__box__related__box__list">
        <?php
        $taxonomy = 'category';
        $current_terms = get_the_terms($post->ID, $taxonomy);
        $terms = array();
        if($current_terms):
            foreach($current_terms as $current_term):
                array_push($terms, $current_term->slug);
            endforeach;
        endif;
        $args = array(
            'post_type' => 'post',
            'posts_per_page' => 6,
            'orderby' => 'rand',
            'post__not_in' => array($post->ID),
            'tax_query' => array(
                array(
                'taxonomy' => $taxonomy,
                'terms' => $terms,
                'field' => 'slug',
                ),
            ),
        );
        $my_query = new WP_Query($args);
        if($my_query->have_posts()):
            while($my_query->have_posts()):$my_query->the_post();
            ?>
            <li class="single__detail__box__left__box__related__box__list__items">
                <a class="single__detail__box__left__box__related__box__list__items__link" href="<?php echo get_permalink(); ?>">
                    <span class="single__detail__box__left__box__related__box__list__items__thumbnail">
                    <?php
                    if(has_post_thumbnail()):
                        the_post_thumbnail();
                    else:
                    ?>
                    <img class="single__detail__box__left__box__related__box__list__items__thumbnail__img" src="<?php echo get_theme_file_uri(); ?>/image/noimage.png">
                    <?php
                    endif;
                    ?>
                    </span>
                    <span class="single__detail__box__left__box__related__box__list__items__meta">
                        <h3 class="single__detail__box__left__box__related__box__list__items__meta__title">
                            <?php echo get_the_title(); ?>
                        </h3>
                        <span class="single__detail__box__left__box__related__box__list__items__meta__catAndTime">
                            <span class="single__detail__box__left__box__related__box__list__items__meta__cat">
                            <?php
                            $related_cats = get_the_terms($post->ID, $taxonomy);
                            if(!empty($related_cats)):
                                foreach($related_cats as $val):
                            ?>
                            <span class="single__detail__box__left__box__related__box__list__items__meta__cat__link">
                                <?php echo $val->name; ?>
                            </span>
                            <?php
                                endforeach;
                            endif;
                            ?>
                            </span>
                            <span class="single__detail__box__left__box__related__box__list__items__meta__time">
                                <?php echo get_the_time('Y.m.d'); ?>
                            </span>
                        </span>
                    </span>
                </a>
            </li>
            <?php
            endwhile;
        else:
        ?>
        <p>現在準備中です。</p>
        <?php
        endif;
        wp_reset_postdata();
        ?>
    </ul>
</div>

'post_type' => 'post',

'post_type' => 'custom_post_type',

$taxonomy = 'category';

$taxonomy = 'custom_taxonomy';

.single__detail__box__left__box__related {
    margin-top: 30px;
}
.single__detail__box__left__box__related__box {
    margin-bottom: 20px;
    padding-bottom: 10px;
    border-bottom: 1px solid #555;
}
.single__detail__box__left__box__related__box__title {
    display: flex;
    justify-content: space-between;
    align-items: end;
    font-size: 22px;
}
.single__detail__box__left__box__related__box__title__text {}
.single__detail__box__left__box__related__box__title__count {
    font-size: 11px;
    color: #888;
    font-weight: 400;
}
.single__detail__box__left__box__related__box__list {}
.single__detail__box__left__box__related__box__list:after {
    content: "";
    display: block;
    clear: both;
}
.single__detail__box__left__box__related__box__list__items {
    width: 216px;
    height: 250px;
    float: left;
    margin-right: 26px;
    margin-bottom: 26px;
}
.single__detail__box__left__box__related__box__list__items:nth-child(3n) {
    margin-right: 0;
}
.single__detail__box__left__box__related__box__list__items__link {}
.single__detail__box__left__box__related__box__list__items__thumbnail {
    display: block;
    margin-bottom: 12px;
}
.single__detail__box__left__box__related__box__list__items__thumbnail__img {
    width: 100%;
    height: 120px;
}
.single__detail__box__left__box__related__box__list__items__meta {
    display: block;
}
.single__detail__box__left__box__related__box__list__items__meta__title {
    font-size: 15px;
    margin-bottom: 9px;
    line-height: 1.5;
    display: -webkit-box;
    -webkit-line-clamp: 4;
    -webkit-box-orient: vertical;
    overflow: hidden;
}
.single__detail__box__left__box__related__box__list__items__meta__catAndTime {
    display: flex;
    align-items: center;
    font-size: 13px;
}
.single__detail__box__left__box__related__box__list__items__meta__cat {}
.single__detail__box__left__box__related__box__list__items__meta__cat__link {
    display: inline-block;
    /* background: #333; */
    background: #2a627e;
    color: #fff;
    padding: 3px 7px;
    font-size: 11px;
    border-radius: 2px;
}
.single__detail__box__left__box__related__box__list__items__meta__time {
    display: inline-block;
    margin-left: 9px;
    color: #777;
}