WooCommerce产品目录页显示评论星级和个数

2023.11.11

为了在产品列表页显示评论个数,需要在woocommerce插件-template-loop文件夹-rating.php,(不考虑换行问题),直接在最后添加

echo $product->get_review_count() . ‘ Reviews’;

2023.10.8修改了代码:移动端评论个数换行显示

1. 修改woocommerce插件loop文件夹中的rating.php

<style>
    .rating-wrapper {
        display: inline-flex;
        align-items: center;
      
    }
    @media (max-width: 768px) {
        .rating-wrapper::after {
            content: "\A";
            white-space: pre;
        }
    }
}
</style>

<?php
/**
 * Loop Rating
 *
 * This template can be overridden by copying it to yourtheme/woocommerce/loop/rating.php.
 *
 * HOWEVER, on occasion WooCommerce will need to update template files and you
 * (the theme developer) will need to copy the new files to your theme to
 * maintain compatibility. We try to do this as little as possible, but it does
 * happen. When this occurs the version of the template file will be bumped and
 * the readme will list any important changes.
 *
 * @see https://docs.woocommerce.com/document/template-structure/
 * @package WooCommerce\Templates
 * @version 3.6.0
 */

if ( ! defined( 'ABSPATH' ) ) {
	exit;
}

global $product;

if ( ! wc_review_ratings_enabled() ) {
	return;
}

echo '<div class="rating-wrapper">';
echo wc_get_rating_html( $product->get_average_rating() ); // WordPress.XSS.EscapeOutput.OutputNotEscaped.
echo '</div> ';
echo '<div class="rating-wrapper">';
echo $product->get_review_count() . ' Reviews';
echo '</div>';

2.主题文件下的functions.php文件最后添加代码

add_action('woocommerce_after_shop_loop_item_title', 'woocommerce_product_ratings_count', 5);
function woocommerce_product_ratings_count()
{
	global $product;
	$rating_count = $product->get_rating_count();
	$review_count = $product->get_review_count();
	$average = $product->get_average_rating();

	$rating_html = wc_get_rating_html($average);
	echo '<div style="display: inline-flex; align-items: center;">';
	echo $rating_html;
	echo '</div> ';
	echo $review_count . ' Reviews';	      
}

2023.9.23版本

WooCommerce只能在产品目录页显示评论星级,但是不能显示评论个数,下面,我将讲解如何显示评论个数:

1. 修改woocommerce插件loop文件夹中的rating.php

推荐这种方法

<style>
    .rating-wrapper {
        display: inline-flex;
        align-items: center;
    }
    
    .rating-score {
        margin-left: 5px;
    }
</style>
<?php
/**
 * Loop Rating
 *
 * This template can be overridden by copying it to yourtheme/woocommerce/loop/rating.php.
 *
 * HOWEVER, on occasion WooCommerce will need to update template files and you
 * (the theme developer) will need to copy the new files to your theme to
 * maintain compatibility. We try to do this as little as possible, but it does
 * happen. When this occurs the version of the template file will be bumped and
 * the readme will list any important changes.
 *
 * @see https://docs.woocommerce.com/document/template-structure/
 * @package WooCommerce\Templates
 * @version 3.6.0
 */

if ( ! defined( 'ABSPATH' ) ) {
	exit;
}

global $product;

if ( ! wc_review_ratings_enabled() ) {
	return;
}

// echo wc_get_rating_html( $product->get_average_rating() ); // WordPress.XSS.EscapeOutput.OutputNotEscaped.


$rating_count = $product->get_rating_count();
$review_count = $product->get_review_count();
$average = $product->get_average_rating();

$rating_html = wc_get_rating_html( $average );

echo '<div class="rating-wrapper">';
echo $rating_html;
// echo '<span class="rating-score">' . $average . '/5 </span>';
echo '</div>';
echo $review_count . ' Reviews';
?>

2.主题文件下的functions.php文件中添加函数

add_action('woocommerce_after_shop_loop_item_title', 'woocommerce_product_ratings_count', 5);
function woocommerce_product_ratings_count()
{
    global $product;

    if ($product->get_rating_count() > 0) {
        $rating_count = $product->get_rating_count();
        $review_count = $product->get_review_count();
        $average = $product->get_average_rating();

        $rating_html = wc_get_rating_html($average);

        echo '<div style="display: inline-flex; align-items: center;">';
        echo $rating_html;
//         echo '<span style="margin-left: 5px;">' . $average . '/5 </span>';
        echo '</div>';
        echo $review_count . ' Reviews';
    } else {
        echo 'No reviews yet';
    }
}

您可能还喜欢...