This guide includes details on the ability to customize our Main Reviews Widget at the code level. For basic customizations of the Main Reviews Widget, please refer to the following guide instead:
Main Reviews Widget: Customizations
Note: The value of the attributes contained in this guide may vary depending on the ecommerce platform you're using.
In This Guide
Customizable Attributes
<div id="stamped-main-widget"
data-widget-type="standard"
data-product-id="{{ product.id }}"
data-name="{{ product.title | escape }}"
data-url="{{ shop.url }}{{ product.url }}"
data-image-url="{{ product.featured_image | product_img_url: "large" |replace: '?', '%3F' | replace: '&','%26'}}"
data-description="{{ product.description | escape }}"
data-product-sku="{{product.handle}}"
data-widget-language="{{ language }}"></div>
| Attribute | Value | What it does | |
| data-take-reviews | 1 (numeric, max 20) | Limit the number of reviews to load per page | |
| data-take-questions | 1 (numeric, max 20) | Limit the number of questions to load per page | |
| data-animation | false (boolean) | Stops the scrolling to reviews widget on badge rating click | |
| data-offset | 150 (numeric) | Adjusts the position of the scrolling to the widget from click of the badge | |
| data-offset-mobile | 150 (numeric) | Adjusts the position of the scrolling to the widget from click of the badge on mobile screens | |
| data-widget-language | ISO 2 Letter Language Codes | Translate the widget into different languages | |
| data-widget-type | standard, profile, minimal, two-columns, masonry, slider | Use a different layout from the selected layout in settings | |
| data-sort | most-recent, highest-rating, lowest-rating, most-votes, least-votes, with-photos, language (*requires business plan) | Sort reviews using the selected value | |
| data-tags-exclude | Review's tag (alphanumeric, separated by comma) | Excludes reviews that are tagged with the selected tags | |
| data-tags-include | Review's tag (alphanumeric, separated by comma) | Includes only reviews that are tagged with the selected tags | |
| data-search | Text to search (alphanumeric) | Includes only reviews that contain the search string | |
| data-linkify | true | Enable hyperlinks on the review/Q&A content | |
Additional Modification for Masonry Widget Style
Modifying the number of columns displayed for the Masonry style based on screen sizes:
<script>
window.macyInstanceConfig = {
breakAt: {
1500: 4,
1200: 3,
700: 2,
500: 1
}
}
</script>