Integrating Loox with Shogun

Loox allows you to display Loox widgets on product pages created through your Shogun page-builder app.

This is done by inserting an HTML element and placing the relevant Loox code in that element.

In this article, we'll go over the steps required to display the Loox Product Reviews or Rating widgets on your Shogun product pages.

Adding an HTML Element in Shogun

In order to add an HTML element to your Shogun product pages, follow these steps:

1. Add an HTML element and drag-and-drop it where you want to display the Loox widget:
2. Double-click the HTML element to open the HTML text box:

Displaying the Rating widget

To integrate a product's Rating widget, follow these steps:

1. Copy the following code:

<a href="#looxReviews">
<div class="loox-rating" data-id="XXXXXXXXXX" data-fetch></div>
</a><br>
	

2. Replace the XXXXXXXXXX with the relevant product ID (here's how to find it).
3. Save and publish your page. The Rating icons will be displayed on the live page you've placed them in:

Displaying the Product Reviews Widget

To integrate a product's Product Reviews widget, follow these steps:

1. Copy the following code:

<div id="looxReviews" data-product-id="XXXXXXXXXX"></div><br>
	

2. Replace the  XXXXXXXXXX with the ID of the product that you'd like to display reviews for (Here's how to find it).
3. Save and publish your page. The Product Reviews widget will be displayed on the live page you've placed it in:

<div id="looxReviews" data-loox-aggregate></div>

Displaying the Legacy Carousel Widget

To integrate the Legacy Carousel Widget, follow these steps:

1. Copy the following code:

<div id="looxCarousel" data-show-more="true"></div>
	

2. Save and publish your page. The widget will be displayed on the live page you've placed it in:
   

If you wish to integrate any of the Loox widgets to non-product Shogun pages, you will need to add the following code before any of the above codes:

<script async src="//loox.io/widget/loox.js?shop=STORE.myshopify.com"></script>

Replace STORE.myshopify.com with your .myshopify store URL.