Deploy Widget Manually

Deploying a widget manually involves placing a Mustache template in your HTML where you want recommendations to appear. The ip.js script (which you should have already installed for tracking) will find this template, fetch the corresponding recommendations, and render the HTML.

Implementation

Place the following <script> block where you want the recommendations to appear.

• Replace YOUR_DELIVERY_KEY with the key generated when you created the Delivery.
• The HTML inside the script tag is a Mustache template that defines the structure for each recommended item. You can customize it to match your site's design.

<script class="idio-recommendations"
        type="text/x-mustache"
        data-api-key="YOUR_DELIVERY_KEY"
        data-rpp="3">
    <div class="recommendation-container">
        {{#content}}
            <div class="recommendation-item">
                <a href="{{link_url}}">
                    {{#main_image_url}}<img src="{{main_image_url}}" alt="{{title}}">{{/main_image_url}}
                    <p>{{title}}</p>
                </a>
            </div>
        {{/content}}
    </div>
</script>

The data-api-key attribute links the on-page template to your server-side Delivery configuration. The data-rpp="3" attribute overrides the server-side setting and requests exactly three recommendations. See the Widget SDK documentation for more available attributes.