在Woocommerce商店和类别页面上的产品上添加星级

Question

默认情况下，woocommerce在商店页面上仅显示1个产品的星级。我希望它显示所有产品的星级，因此我使用了以下代码

    add_action('woocommerce_after_shop_loop_item', 'get_star_rating' );
function get_star_rating()
{
    global $woocommerce, $product;
    $average = $product->get_average_rating();

    echo '<div class="star-rating"><span style="width:'.( ( $average / 5 ) * 100 ) . '%"><strong itemprop="ratingValue" class="rating">'.$average.'</strong> '.__( 'out of 5', 'woocommerce' ).'</span></div>';
}

在这段代码之后，我面临两个问题。首先，它不是以星级评分而是以数字形式显示评分，其次是产品缩略图的布局混乱。在产品类别中，它显示星级，但布局仍然混乱。

知道我在做什么错吗？

相关网站为

中的oldbookdepot（dot）