【SANGOカスタマイズ】記事一覧グリッドのカードにユーザー名とサムネイルを表示する方法

/*********************
記事一覧グリッドのカード（関数にして使いまわせるように）
*********************/
if( ! function_exists( 'sng_normal_card' ) ) {
  function sng_normal_card(){ ?>
    <article class="cardtype__article">
        <a class="cardtype__link" href="<?php the_permalink() ?>">
          <p class="cardtype__img">
            <img src="<?php echo featured_image_src('thumb-520'); ?>" alt="<?php the_title(); ?>">
          </p>
          <div class="cardtype__article-info">
            <?php if(!get_option('remove_pubdate')):?>
            <time class="updated entry-time dfont" datetime="<?php the_time('Y-m-d'); ?>"><?php echo get_post_time('Y.m.d D');?></time>
            <?php endif; ?>
            <h2><?php the_title(); ?></h2>
          </div>
        </a>
        <?php
        if(!is_archive()) output_catogry_link();//カテゴリーを出力
        newmark();//newマーク
        ?>
    </article>
<?php
  }
}/*end sng_normal_card*/

<div class="tb-left top-grid">
  <div class="author_img top-grid">
    <?php $iconimg = get_avatar( get_the_author_meta( 'ID' ), 100 ); if($iconimg) echo $iconimg; //サムネイル ?>
  </div>
  <a class="dfont top-grid" href="<?php echo esc_url(get_author_posts_url( get_the_author_meta( 'ID' ) )); ?>">
    <?php esc_attr(the_author_meta('display_name'));//ユーザー名 ?>
  </a>
</div>

/*--------------------------------------
サムネイルとユーザー名を追加
--------------------------------------*/
.tb-left.top-grid {
  display: flex;
  margin-left: 13px;
  margin-right: 13px;
}
.tb-left.top-grid.single-page {
  margin-left: 0px;
  margin-right: 0px;
}
@media screen and (max-width: 768px) {
	.tb-left.top-grid.single-page {
	  margin-left: 13px;
	  margin-right: 13px;
	}
}
.dfont.top-grid {
  margin-left: 8px;
  padding-top: 6px;
}
.author_img.top-grid {
  width: 48px;
  height: 48px;
}
.author_img.top-grid img {
  border: solid 3px #dfe2e8;
}
.top-grid .cardtype__link {
  padding-bottom: 13px;
}
.cardtype__link {
	padding-bottom:13px;
}