Deploy widget manually

1 min

Deploying a widget manually involves placing a Mustache template in your HTML where you want recommendations to appear. The ip.js script will find this template, fetch the corresponding recommendations, and render the HTML.

Implementation

Place the following <script> block where you want the recommendations to display:

Replace YOUR_DELIVERY_KEY with the key generated when you created the deliveryyou 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 Widget SDK referenceWidget SDK reference for more available attributes.