Trong một số trang , yêu cầu hiện thị số lượng đã review sản phẩm ( đánh giá sao ) muốn show ra để mọi người cùng… đánh giá sản phẩm của mình. Hôm nay, Vua Code sẽ hướng dẫn cách thực hiện nó nhé.
Thêm số đánh giá cho sản phẩm trong wordpess
Bạn coppy code bên dưới cho vào file Functoin nhé
add_filter( 'woocommerce_product_get_rating_html', 'loop_product_get_rating_html', 100, 3 );
function loop_product_get_rating_html( $html, $rating, $count ){
if ( 0 < $rating && ! is_product() ) {
global $product;
$rating_cnt = array_sum($product->get_rating_counts());
$count_html = ' <div class="count-rating">(' . $rating_cnt .')</div>';
$html = '<div class="container-rating"><div class="star-rating">';
$html .= wc_get_star_rating_html( $rating, $count );
$html .= '</div>' . $count_html . '</div>';
}
return $html;
}
Sau khi thêm xong , bạn thử vào đánh giá 1 sản phẩm nào đó nhé
bạn quay lại trang sản phẩm sẽ thấy Số lượng đánh giá được Show ra nhé
Update Code 12/04/2024
Do WP đã update và Woocoo cũng update theo nên code trên có chút lỗi, Anh em Update theo code này nhé
add_filter( 'woocommerce_product_get_rating_html', 'loop_product_get_rating_html', 100, 3 );
function loop_product_get_rating_html( $html, $rating, $count ){
if ( 0 < $rating && ! is_product() ) {
global $product;
$rating_cnt = array_sum($product->get_rating_counts());
$count_html = ' <div class="count-rating">(' . $rating_cnt .')</div>';
$html = '<div class="container-rating"><div class="star-rating">';
$html .= wc_get_star_rating_html( $rating, $count );
$html .= '</div>' . $count_html . '</div>';
}
return $html;
}
Các bạn giúp Vua Code thêm 1 xíu CSS để cho đẹp và chuyên nghiệp hơn nhé
/*Đánh giá sao*/
.count-rating {
margin-top: 7px;
}
.container-rating {
display: flex;
}
Chúc bạn Thành công nhé. Có gì thắc mắc liên hệ Vua Code nhé.