ベストセラーに商品に付けられたタグが上手く表示されません。

[rei-n]

お世話になっております。
usces_filter_bestseller()のフックを使い、ベストセラーの商品情報を表示したいのですが、the_terms()やthe_tags()を使った部分だけなぜか先頭に出力されてしまい、上手く表示できません。
問題なく表示するにはどのようなコードを書けばよいのでしょうか。

/=== 現状のfunction.php ===/

add_filter('usces_filter_bestseller', 'my_bestseller_func', 10, 3);
function my_bestseller_func() {

$args = func_get_args();

list($html, $post_id, $index) = $args;

$post = get_post($post_id);

if ( $index == 0 ){

$img = 'http://www.example.com/img/rank-1.png';

}    elseif ( $index == 1 ){

$img = ''http://www.example.com/img/rank-2.png';

}    elseif ($index == 2){

$img = 'http://www.example.com/img/rank-3.png';

}    else {
} 

$list = '
<li>
<img src="'.$img.'" alt="" class="rank"/>
<div class="ranking-item">
<a href="'.get_permalink($post_id).'">'.usces_the_itemImage(0, 150, 150, $post, 'return' ).'</a>
<a href="'.get_permalink($post_id).'">'.$post->post_title.'</a>
'.the_terms($post, 'taxonomy').'   //ここが問題の部分です
</div>
</li>
';

return $list;
}

/=== 出力されるHTML ===/

<ul>
//先頭に出力されてしまう部分です。
<a href="">商品1のタグ</a>
<a href="">商品2のタグ</a>
<a href="">商品3のタグ</a>

<li>
<img src="" alt="順位の画像"/>
<div clss="ranking-item">
<a href=""> <img src="" alt="商品1の画像" /></a>
<a href="">商品1のタイトル</a>
</div>
</li>

<li>
<img src="" alt="順位の画像"/>
<div clss="ranking-item">
<a href=""> <img src="" alt="商品2の画像" /></a>
<a href="">商品2のタイトル</a>
</div>
</li>

・・・

</ul>

/=== 理想のHTML ===/

<ul>

<li>
<img src="" alt="順位の画像"/>
<div clss="ranking-item">
<a href=""> <img src="" alt="商品1の画像" /></a>
<a href="">商品1のタイトル</a>
<a href="">商品1のタグ</a>
</div>
</li>

<li>
<img src="" alt="順位の画像"/>
<div clss="ranking-item">
<a href=""> <img src="" alt="商品2の画像" /></a>
<a href="">商品2のタイトル</a>
<a href="">商品2のタグ</a>
</div>
</li>

・・・

</ul>

どうぞよろしくお願いします。

——————————————-
WordPress のバージョン：WordPress 4.3
Welcart のバージョン： 1.4.21
ご利用のテーマ：オリジナル
症状を確認したブラウザ：Google chrome
サーバー（会社名、サービス名）：ローカル環境
SSLの利用：　無し
WordPress のパーマリンク設定：/%category%/%post_id%/
——————————————–

[投稿者]

投稿