Aggregate Widgets for Products Page

The purpose of this article

Testimonial Tree provides a simple widget that displays the average rating with the amount of star icons and provides a link to view the testimonials that are used to generate this aggregate score. 

If you have a products page with several different types of products and you want to use this widget to display the aggregate score for each product. This article explains how to set this up. 


Enabling Setting

After you've created the Aggregate Widget, navigate to Widgets -> Manage Widgets, by using the side panel in the Testimonial Tree dashboard. In widget management page you will see a gear icon all the way to right of the table. Click on that gear icon for the Aggregate widget you just created. 


You should now see a page with a header labeled "Advanced Settings", scroll towards the bottom of the settings, and you should see a setting labeled "Use For Products Page (Multiple Divs)", you want to click on the drop down and select the "Yes" option. 



Adding Widget To Products Page

The next step is to include the widget in your product page. First you want to grab the widget code for the aggregate widget. You can locate this in the same page you found the gear icon for advanced settings, listed in the column "Get Code". This will open a modal with the widget code, which should look something like this. The script tag will require some changes to get this working, but for now just copy the code it provides. This is just an example, don't use the code in this article, its just to be used as a sample.

<div id='TestimonialTree_Widget_8367'></div>
<script src='' type='text/javascript'></script>

You can insert this anywhere you like in your html for your page, i prefer to add it towards the bottom, that way everything else loads first. Than for each product on the page you also want to insert an extra div tag with an id attribute of the specific meta data field for example product id, product name, or sku for the specific product.

You have to do this for each product, you want the aggregate widget to display for. 

The div id must be in this format, it is crucial you use the same exact format or the widget wont work. Again this is just a sample, make sure you are adding in the meta data youre using with the widget.

<div id='testimonialtree_widget_metafield_SKU_metavalue_123456'></div>
"metafield" is the label of the meta data and "metavalue" is the value. So lets say you want this widget to work with products with the id of 12290. You would write it out like so "testimonialtree_widget_metafield_product_id_metavalue_51"

Now back to the script tag. You need to include a metadata parameter that includes all the products on the page and should be formatted exactly how the bottom example shows it. 

<script src='{"product_id":["51","52","53"],"SKU":["123456"]}'type='text/javascript'></script>
This is how the final code should be look like: **Make sure to still include the original div tag containing the widget id
Filtering by Username & MetaData
To filter the testimonials by meta data and username, you can just append the username parameter after the meta data parameter. For example 
Have more questions? Submit a request


Please sign in to leave a comment.
Powered by Zendesk