All Collections
Getting Started
Installation
Shopify Installation - Booster Themes
Shopify Installation - Booster Themes

How to integrate Fera with "Booster" themes so that rating stars show.

Jameela G avatar
Written by Jameela G
Updated over a week ago

This guide is for merchants using the third-party Booster Themes.

If you're not using a Booster theme or don't know if you're using one, please don't follow these instructions.

Prerequisites

  • You are running one of the Booster themes on a Shopify store.

  • You are a web developer

  • You have a product rating badge widget created in Fera.

Instructions

  1. Note the product average rating badge widget ID in Fera from the URL you're editing or the tag snippet.

  2. Edit the store's theme and open the asset `assets/boost-pfs-filter.js`.

  3. Replace lines 93-98 with this code:

    if (boostPFSThemeConfig.custom.show_product_review || window.fera) {
    var itemReviewHtml;
    if (window.fera) {
    itemReviewHtml = '<div data-fera-container="PLACE_YOUR_WIDGET_ID_HERE" data-product_id="' + data.id + '"></div>';
    } else {
    itemReviewHtml = '<span class="shopify-product-reviews-badge" data-id="{{itemId}}"></span>';
    }
    itemHtml = itemHtml.replace(/{{itemReviewHtml}}/g, itemReviewHtml);
    } else {
    itemHtml = itemHtml.replace(/{{itemReviewHtml}}/g, '');
    }

(replacing PLACE_YOUR_WIDGET_ID_HERE with your widget's ID from step 1.)

4. At line 673 in the same file add if (window.fera) fera.refreshContent();

5. Replace lines 164-169 with the same lines in step 3.

6. Edit assets/collections-filtres.js and at line 86 add the same code from step 4.

Did this answer your question?