簡単！プラグインなしで関連記事を表示する方法 ｜ WordPress　カスタマイズ

add_image_size('thumb170',170,100,true);

<!--関連記事-->
    <h3 class="rltd_pst_midashi">関連記事</h3>
    <?php
        $categories = get_the_category($post->ID);
        $category_ID = array();
        foreach($categories as $category):
          array_push( $category_ID, $category -> cat_ID);
        endforeach ;
        $args = array(
          'post__not_in' => array($post -> ID),
          'posts_per_page'=> 5,
          'category__in' => $category_ID,
          'orderby' => 'rand',
        );
        $query = new WP_Query($args); ?>
          <?php if( $query -> have_posts() ): ?>
          <?php while ($query -> have_posts()) : $query -> the_post(); ?>

          <div class="related_posts">
              <div class="related_posts_thumb">
                  <a href="<?php the_permalink() ?>" title="<?php the_title_attribute(); ?>">
                      <?php if ( has_post_thumbnail() ): ?>
                      <?php echo get_the_post_thumbnail($post->ID, 'thumb170'); ?>
                      <?php else: ?>
                      <img src="<?php echo get_template_directory_uri(); ?>/images/no-image.png" alt="NO IMAGE" title="NO IMAGE" width="170px" />
                      <?php endif; ?>
                  </a>
              </div><!-- related_posts_thumb -->
              
              <div class="related_posts_content">
                  <h4 class="related-entry-title">
                    <a href="<?php the_permalink(); ?>"><?php the_title(); ?></a>
                  </h4>
                  <p class="rltd_pst_snippet"><?php echo mb_substr( strip_tags( $post->post_content  ), 0, 60 ) . ''; ?></p>
                  <p class="rltd_pst_read"><a href="<?php the_permalink(); ?>">記事を読む</a></p>
              </div><!-- related_posts_content -->
          </div><!-- related_posts -->
  
          <?php endwhile;?>
  
          <?php else:?>
          <p>同カテゴリーの関連している記事はありません。</p>
          <?php
        endif;
        wp_reset_postdata();
    ?>

get_template_part( 'content', get_post_format() );

// Previous/next post navigation.
twentyfourteen_post_nav();

get_template_part( 'related_posts' );

.rltd_pst_midashi {
        clear: both;
	font-size: 24px;
	padding-bottom: 5px;
	padding-top: 3px;
	padding-left: 10px;
	margin: 50px 0px 20px 0;
	border-left: #ddd 8px solid;
	padding-right: 10px;
	}
.related_posts {
        clear:both;
	border-bottom: 1px #dedede dashed;
	margin-bottom:10px;
	}
.related_posts_thumb img {
	width:170px;
	float:left;
	margin:0 20px 10px 0;
	}
.related_posts_content h4 {
	font-weight: bold;
	font-size: 22px;
	line-height: 24px;
	margin-bottom:10px;
	}
.rltd_pst_snippet {
	margin:0;
	line-height:20px;
	}
.rltd_pst_read {
	margin:0 0 10px 0;
	display:block;
	text-align:right;
	}