Skip to main content

Frontend

Workflow

Include the library

Add the library from our CDN and instantiate it before the end of the body tag. Replace [website] and [public_token] with the website name ant the public token retrieved from the Visidea dashboard.

<script src="https://cdn.visidea.ai/js-visidea/js-visidea-3.0.0.min.js"></script>
<script>
    window.onload = function() {
        visidea("[website]","[public_token]");
    };
</script>

Insert the search modal where you want to display (usually before the end of the body)

Replace [user_id] with the user ID from your CMS.

<div class="visidea-search-bar" user_id="[user_id]"></div>

Insert the recommendations widget on the home page

Replace [user_id] with the user ID from your CMS.

<div class="visidea-recommendations" page="home" user_id="[user_id]"></div>

Insert the recommendations widget on the product detail page

Replace [user_id] with the user ID and [item_id] with the product ID from your CMS.

<div class="visidea-recommendations" page="product" user_id="[user_id]" item_id="[item_id]"></div>

Insert the recommendations widget on the cart page

Replace [user_id] with the user ID from your CMS.

<div class="visidea-recommendations" page="cart" user_id="[user_id]"></div>

Insert the recommendations widget on the checkout page

Replace [user_id] with the user ID from your CMS.

<div class="visidea-recommendations" page="order" user_id="[user_id]"></div>

Track a view on the product detail page

Replace [user_id] with the user ID and [item_id] with the product ID from your CMS.

<meta class="visidea-interaction" type="item" user_id="[user_id]" item_id="[item_id]" />

Workflow