Loox Reviews
Add social proof to your funnels with customer reviews and ratings.
This article shows you how to add Loox Reviews to your products in a funnel. When you complete these steps, Funnelish can pull reviews and ratings from your Shopify store into the funnel step.
Loox Reviews is a freemium app. You can display star ratings for free but need a paid account to access the other widget functionalities. You can read the Loox developer document and learn how to enable all the widget functions on your site.
Star review placed under a funnel product image.
The first step is to install the Loox app on your Shopify store.
- 1.
- 2.Type Loox Product Reviews into the search bar.
- 3.Click the app name.
Select Loox Product Review in the Shopify App Store.
4. Log in to your Shopify store (if prompted).
5. On the next page, read the terms and if you agree, click Install app.
6. Click the Let's get started button and complete the setup workflow.
Once you finish setting up Loox on Shopify, you can collect and display customer reviews on a product page.
Loox reviews displayed on a product page.
The next step is to add some code to your funnel.
You'll need to copy and paste some text in this step. We suggest you open a Notepad file to save code as an in-between step.
Find and copy the product ID for the item in your Shopify store.
- 1.Go to your Shopify store dashboard.
- 2.Click Products on the side menu.
- 3.Click the product you want to link with Loox on your funnel.
- 4.Go to the address bar.
- 5.Copy the product number in the URL. It's the last series of numbers after the slash (/).
- 6.Paste the product ID into a Notepad file.
Get the product ID copying the digits at the end of the URL after the slash (/).
- 1.Copy this snippet and paste it into a Notepad file.
<script async src="//loox.io/widget/loox.js?shop=STORE.myshopify.com"></script>
- 2.Replace the word STORE in the snippet with your store name.
Make sure there are no spaces after the "=" sign.
Example snippet with a sample store name.
- 1.Copy the edited snippet of your Notepad file. (The one with your store name)
- 2.In Funnelish, go to the Funnels tab in your header menu.
- 3.Open a funnel and go to the step that has the product you want to link to Loox.
- 4.Click the Edit page button.
- 5.Go to the top left corner and click the More actions icon (the three dots <…>).
- 6.Click Custom codes.
Click the more action icon <…> and then, custom codes.
On the pop window:
- 1.Click the Custom JS (body) tab at the top of the window.
- 2.Paste the edited snippet. (The one with your store name)
%20for%20loox%20reviews.png?alt=media&token=684ab4de-fb02-4502-8559-a5e15ffc2e71)
- 3.Click Save changes.
- 4.Click the Save changes button in the top right corner of your page.
The last step is to drag and drop the Custom HTML element into your canvas. This element is the one that will display customer reviews and ratings on the step.
You need to decide where to place the Loox information. In this example, we place the star rating under a product image.
We use a two-column row to hold the Custom HTML component. You could use a different structure.
- 1.Place a Section component on the canvas under the product image.
- 2.Select the two-column row option.
Add a section below your product image.
3. Select a cell.
4. Place the Custom HTML component inside the cell.
Place the Custom HTML component inside the cell.
5. Go to the left panel.
6. Click the Edit custom HTML button.
Click Edit custom HTML in the settings panel.
- 7.A new pop-up window will display. Before adding something, follow the steps below to edit the code for your corresponding product.
Follow the steps below to place customer star ratings in the funnel.
Showcase of product images with star reviews.
- 1.Paste this code into Notepad.
<div class="loox-rating" data-fetch data-id="XXXXXXXXXX"></div>
- 2.Replace the XXXXX in the snippet with the Shopify product ID (the ID you saved in Notepad in the previous step).
Make sure there are no spaces between the quotation marks and numbers.
Example of the code with a product ID replacing the XXXXX.
3. Click the Save changes button.
4. Click Save changes again on the funnel dashboard.
5. Click Preview to see the funnel step and customer reviews.
If the ratings do not appear in Preview mode, you might need to whitelist your funnel domain. Go to your Shopify store and open the Loox settings page. Learn more.
Nothing displays on the funnel step if your Shopify product has no ratings.
To quickly add Loox display code to another product:
- 1.Copy the Custom HTML component.
- 2.Paste the component into a different cell location.
- 3.Replace the product ID with the number corresponding to the new product.
- 4.Click Save changes.
The above example showed you how to place star ratings on a funnel step. There are other options available for more customization.
To display full reviews on the funnel step, follow all the steps above but paste this snippet into the Custom HTML component.
Be sure to replace the XXXXX with the unique product ID.
<div id="looxReviews" data-product-id="XXXXXXXXXX"></div>
Showcase of a product image with full Loox reviews.
Use this snippet to pull all reviews from your Shopify store into the funnel. Follow all the steps described above but paste this snippet into the Custom HTML component.
<div id="looxReviews" data-loox-aggregate></div>
Display all the product reviews.
Loox provides other snippets for widgets that you can place in popups, sidebars, or carousels. Learn more.
Last modified 4mo ago