Menu Close

WooCommerce: Display Product Reviews @ Custom Page (Shortcode)

default

WooCommerce product reviews shows by default in the “Reviews” tab in the single product page. But what if, like me, you’re using custom sales pages and need to show such reviews elsewhere – by using a shortcode?

I’ve spent some time doing this for two Business Bloomer pages, the contact page (beside the request a quote form) and the Bloomer Armada sales page (just above the pricing table), so I thought it would have been great sharing the snippet with you. Enjoy!

Here’s my custom “WooCommerce product reviews shortcode” output on a test website homepage.

PHP Snippet: WooCommerce Product Reviews Shortcode

Once the snippet below is added to your functions.php, simply use shortcode [product_reviews id=”123″] anywhere you like. Please note “id” is the ID of the product for which you want to output customer reviews.

/**
 * @snippet       WooCommerce Product Reviews Shortcode
 * @how-to        Get CustomizeWoo.com FREE
 * @author        Rodolfo Melogli
 * @testedwith    WooCommerce 3.9
 * @donate $9     https://businessbloomer.com/bloomer-armada/
 */

add_shortcode( 'product_reviews', 'bbloomer_product_reviews_shortcode' );

function bbloomer_product_reviews_shortcode( $atts ) {
	
	if ( empty( $atts ) ) return '';

	if ( ! isset( $atts['id'] ) ) return '';
		
	$comments = get_comments( 'post_id=' . $atts['id'] );
	
	if ( ! $comments ) return '';
	
	$html .= '<div class="woocommerce-tabs"><div id="reviews"><ol class="commentlist">';
	
	foreach ( $comments as $comment ) {	
		$rating = intval( get_comment_meta( $comment->comment_ID, 'rating', true ) );
		$html .= '<li class="review">';
		$html .= get_avatar( $comment, '60' );
		$html .= '<div class="comment-text">';
		if ( $rating ) $html .= wc_get_rating_html( $rating );
		$html .= '<p class="meta"><strong class="woocommerce-review__author">';
		$html .= get_comment_author( $comment );
		$html .= '</strong></p>';
		$html .= '<div class="description">';
		$html .= $comment->comment_content;
		$html .= '</div></div>';
		$html .= '</li>';
	}
	
	$html .= '</ol></div></div>';
	
	return $html;
}
View Source
Posted in WooCommerce Tips