Install widgets on older themes without app blocks

If your theme was built before Shopify's Online Store 2.0 (a "vintage" theme), the theme editor won't offer WiseReviews app blocks. You can still install every widget by adding small snippets to your theme code.

Not comfortable editing theme code? Message us from the chat widget and we'll help you set it up.

Before you start

• Enable the WiseReviews app embed first (theme editor → App embeds → toggle WiseReviews on). The widgets can't load without it. See Install the review widgets on your store.
• Consider duplicating your theme as a backup.

Step 1: Create the snippets

1. Go to Online Store → Themes, click the ⋯ button on your theme, and choose Edit code.

2. In the Snippets folder, click Add a new snippet, name it wise-product-reviews, paste this, and save:

<wise-product-reviews data-product-id="{{ product_id }}" data-default-type="{{ default_type }}"></wise-product-reviews>

3. Create a second snippet named wise-star-rating with:

<wise-star-rating
  {% capture productID %}{{ product.id }}{% endcapture %}
  data-average-rating="{{ shop.metafields.wisereviews.reviews.value.products[productID].average_rating }}"
  data-reviews-count="{{ shop.metafields.wisereviews.reviews.value.products[productID].reviews_count }}"
  data-star-size="{{ star_size | default: 18 }}"
  data-align="{{ align | default: 'left' }}"
></wise-star-rating>

4. Create a third snippet named wise-featured-reviews with:

<wise-featured-reviews></wise-featured-reviews>

Step 2: Render the widgets in your theme

Product Reviews (the full reviews list): open your product template (templates/product.liquid or sections/main-product.liquid) and add this where reviews should appear, usually below the product description:

{% render 'wise-product-reviews', product_id: product.id, default_type: 'product_reviews' %}

The default_type controls the tabs: product_reviews or shop_reviews set the default active tab, while product_reviews_only or shop_reviews_only hide the tabs and show just one list.

Star Rating: in the same product template, add this near the product title:

{% render 'wise-star-rating', product: product, star_size: '18', align: 'left' %}

The same line also works inside product card snippets for collection pages; see Show star ratings on your collection pages.

Featured Reviews: add this to any template or section where you want the carousel (your homepage template, for example):

{% render 'wise-featured-reviews' %}

Step 3: Check your storefront

Click Save and open a product page. The widgets pick up your colors, texts, and layout from Review widgets settings just like app-block installs.

Still stuck? Message us from the chat widget and we'll help.