Installing optional widgets on product pages (vintage themes)

Available for: Merchants using CREMA Review with a Shopify vintage theme. If you are using Shopify Online Store 2.0, refer to our Shopify Online Store 2.0 guide. If you are not sure which theme version you're using, refer to Shopify's instructions.

 

In this article

• Reviews Carousel
• Media Grid
• Reviews Board Summary
• Social Media Widget
• Product Variant’s Reviews
• UGC Preview Widget
• UGC Preview Widget+Rating

 

Reviews Carousel

1. Go to your Shopify Themes menu and click Actions → Edit Code.
2. Open product.liquid, add the following code under {% section 'product-template' %} and click Save.

<div class="crema-product-reviews" data-product-code="{{ product.id }}" data-widget-style="horizontal_scroll"></div>

 

Media Grid

1. From Edit Code menu, open product.liquid.
2. Add the following code under {% section 'product-template' %} and click Save.

<div class="crema-product-reviews" data-product-code="{{ product.id }}" data-widget-style="gallery"></div>

 

Reviews Board Summary

1. From Edit Code menu, open product.liquid.
2. Add the following code under {% section 'product-template' %} and click Save.

<div class="crema-product-reviews" data-product-code="{{ product.id }}" data-widget-style="detachable_board"></div>

 

Social Media Widget

1. From Edit Code menu, open product.liquid.
2. Add the following code under {% section 'product-template' %} and click Save.

<div class="crema-product-reviews" data-product-code="{{ product.id }}" data-widget-style="external"></div>

 

Product Variant's Reviews

1. From Edit Code menu, open product-template.liquid.
2. Add the following code under {{ product.description }} and click Save.

<div class="crema-product-reviews" data-product-code="{{ product.id }}" data-widget-style="product_options"></div>

 

UGC Preview Widget

1. From Edit Code menu, open product-template.liquid.
2. Add the following code under {{ product.description }} and click Save.

<div class="crema-product-reviews" data-product-code="{{ product.id }}" data-widget-style="photo_thumbnail"></div>

 

UGC Preview Widget+Rating

1. From Edit Code menu, open product-template.liquid.
2. Add the following code under {{ product.description }} and click Save.

<div class="crema-product-score" data-product-code="{{ product.id }}"></div>

 

Please refer to our display widgets showcase page for further information about the widgets.

If you need help installing CREMA widgets on your vintage theme, feel free to chat us or email us at support.global@cre.ma