WooCommerce: Manually Installing Reviews Widget and Star Rating

Yotpo's Reviews Widget and Star Rating are automatically installed on your WooCommerce store when you install the Yotpo Reviews app.

The manual installation process is relevant to the following cases:

• The widgets weren't properly installed due to the complexity of the used store theme

• The widgets are to be placed in custom locations and not the default on-site locations

• A workaround to display our widgets when using third-party builders (e.g., Elementor, Divi)

Important:

We strongly recommend having basic proficiency with PHP when installing the widgets.

Yotpo Support will be happy to assist with functionality issues related to Yotpo's code, however, issues related to the validity and customization of custom code are not supported.

Widget requirements

The default widget functions of the Yotpo Reviews plugin check whether the current page (i.e where the function is called) is:

• A product page

• Allows comments (reviews) to be posted 

Starting from Yotpo version 1.2.0 it is possible to pass a false argument to the functions to prevent them from checking if comments are allowed, e.g. wc_yotpo_show_widget(false);

Please use one of the following methods to manually install these two widgets in your shop:

Method 1: Using the functions

If you wish to add the widgets to specific areas of your theme, you can simply use the PHP functions for both widgets on the corresponding template pages. 

• Use wc_yotpo_show_buttomline() to show the Star Rating 

• Use wc_yotpo_show_widget() to show the Reviews Widget

Example:

<?php if ( function_exists( 'wc_yotpo_show_buttomline' ) ) { wc_yotpo_show_bottomline(); } ?>
<?php if ( function_exists( 'wc_yotpo_show_widget' ) ) { wc_yotpo_show_widget(); } ?>

Method 2: Using hooks (actions)

This method requires modifying the functions.php file of the theme to inject the various widgets. Please make sure to check which hooks are available in your theme.

For example, to show the Reviews Widget, try adding this to the theme functions.php file:

if ( function_exists( 'wc_yotpo_show_widget' ) ) { add_action( 'woocommerce_after_single_product', 'wc_yotpo_show_widget', 15 ); }

To show the Star Rating, try adding this:

if ( function_exists( 'wc_yotpo_show_buttomline' ) ) { add_action( 'woocommerce_single_product_summary', 'wc_yotpo_show_buttomline', 15 ); }

To show the Star Rating on Category pages, try adding this:

if ( function_exists( 'wc_yotpo_show_buttomline' ) ) { add_action( 'woocommerce_after_shop_loop_item_title', 'wc_yotpo_show_buttomline', 5 ); }

Method 3: Using shortcode

This method requires modifying the functions.php file of the theme to create various shortcodes to reference our widgets within the product pages.

To create a shortcode for the Star Rating add this:

add_shortcode( 'yotpo_star_rating', 'wc_yotpo_show_buttomline');

To create a shortcode for the Reviews Widget add this:

add_shortcode( 'yotpo_main_widget', 'wc_yotpo_show_reviews_widget');

If adding the above shortcode to your product page causes errors during editing or saving, try adding the code below to prevent the widget from loading in the editor, allowing it to render only on the live page.

For the Reviews Widget try this:

function custom_yotpo_reviews_widget_shortcode()
{
	// Access the global $product variable
	global $product;

	// Check if the $product object is null or invalid
	if (empty($product) || ! is_a($product, 'WC_Product')) {
		// Return a placeholder or an empty string if there's no valid product
		return '<!-- Yotpo Reviews: Product not available -->';
	}

	ob_start();
	wc_yotpo_show_reviews_widget(); // Yotpo reviews widget function
	return ob_get_clean();
}

add_shortcode('yotpo_main_widget', 'custom_yotpo_reviews_widget_shortcode');

For the Star Rating try this:

function custom_yotpo_stars_widget_shortcode()
{
	// Access the global $product variable
	global $product;

	// Check if the $product object is null or invalid
	if (empty($product) || ! is_a($product, 'WC_Product')) {
		// Return a placeholder or an empty string if there's no valid product
		return '<!-- Yotpo stars: Product not available -->';
	}

	ob_sotart();
	wc_yotpo_show_buttomline(); // Yotpo stars widget function
	return ob_get_clean();
}

add_shortcode('yotpo_star_rating', 'custom_yotpo_stars_widget_shortcode');