Integration VIA Scripts
Initialize the following code snippet before closing <body> tag at each page of your website:
...
<script>
var widgetScript = document.createElement('script');
widgetScript.onload = function () {
_garderoboWidget.then(function(widget) {
widget.init('<API_KEY>', {lang_code: 'en', user_id: '<user_id>'});
});
};
widgetScript.src = 'https://widget.garderobo.ai/widget.js';
document.head.appendChild(widgetScript);
</script>
</body>You also need to initialize a set of items that have already been added to the shopping cart
_garderoboWidget.then(function(widget) {
//Get a list of all identifiers of items added to the cart
var cartProductsArray = [...]
//The second parameter should be passed the relative path to the cart page
widget.setCartProducts(cartProductsArray, '/cart/');
});To initialize the favorite products, the following script must be executed
_garderoboWidget.then(function(widget) {
//Get a list of identifiers of all products added to favourites
var favoritProductsArray = [...]
widget.setFavoritesProducts(favoritProductsArray);
});Callback Functions
Event "Add item to cart"
When a user clicks on the "Add to Cart" button in the widget, you need to handle this signal and perform the add to cart action on the site.
...
<script>
_garderoboWidget.then(function(widget) {
widget.registerCallback.addToCartEvent(function(sizeId, data) {
//Add item to cart
//Update the list of items added to cart
cartProductsArray.push(sizeId);
widget.setCartProducts(cartProductsArray, '/cart/');
});
});
</script>
…Event "Add product to favorites"
When a user clicks on the "Favorites" icon, you need to process the following signal and add the product to the site's favorites or remove it from the favorites.
...
<script>
_garderoboWidget.then(function(widget) {
widget.registerCallback.addToFavorites(function(productId, state, data) {
//Add to favourites (if state = true) or remove from favourites
});
});
</script>
…Full Code
The complete widget initialization script should look like this:
...
<script>
var widgetScript = document.createElement('script');
widgetScript.onload = function () {
_garderoboWidget.then(function(widget) {
widget.init('<API_KEY>', {lang_code: 'en', user_id: '<user_id>'});
widget.setCartProducts(cartProductsArray, '/cart/');
widget.setFavoritesProducts(favoritProductsArray);
widget.registerCallback.addToCartEvent(function(sizeId, data) {
//your handler code here
cartProductsArray.push(sizeId);
widget.setCartProducts(cartProductsArray, '/cart/');
});
widget.registerCallback.addToFavorites(function(productId, state, data) {
//your handler code here
});
});
};
widgetScript.src = 'https://widget.garderobo.ai/widget.js';
document.head.appendChild(widgetScript);
</script>
</body>Last updated