プラグイン無しでSANGOのカード型デザインで関連記事を表示させるWordPressのソース

<?php if( has_category() ) {
    $cats = get_the_category();
    $catkwds = array();
    foreach($cats as $cat) {
        $catkwds[] = $cat->term_id;
    }
} ?>
<?php
$myposts = get_posts( array(
    'post_type' => 'post',
    'posts_per_page' => '6',
    'post__not_in' => array( $post->ID ),
    'category__in' => $catkwds,
    'orderby' => 'rand'
) ); 
if( $myposts ): ?>
 
<div class="cardtype cf">
<?php foreach($myposts as $post):
setup_postdata($post); ?>
<article class="cardtype__article">
    <a class="cardtype__link" href="<?php the_permalink(); ?>">
      <p class="cardtype__img">
    <?php if( has_post_thumbnail() ): ?>
    <?php echo get_the_post_thumbnail($post->ID, 'thumb100'); ?>
        <?php else: ?>
        <img src="<?php echo get_template_directory_uri(); ?>/images/no-image.png" alt="NO IMAGE" title="NO IMAGE" width="100px" />
        <?php endif; ?>
      </p>
      <div class="cardtype__article-info">
        <time class="pubdate entry-time dfont" itemprop="datePublished"><?php the_time("Y年m月d日"); ?></time>        <h2><?php the_title(); ?></h2>
      </div>
    </a>
<?php
  $category = get_the_category();
  $cat_id   = $category[0]->cat_ID;
  $cat_name = $category[0]->cat_name;
  $cat_slug = $category[0]->category_nicename;
?>
<a class="dfont cat-name" href="<?php echo $cat_slug; ?>"><?php echo $cat_name; ?></a>
</article>
<?php endforeach; ?>
<?php wp_reset_postdata();
endif; ?>
</div>