Product Recommendations

You can use Flashy Product Recommendations using our JS library.

Injecting Recommendations

If you want to inject product recommendations into a specific element you can use it like this.

flashy.inject({
       "selector": ".cart", // The element you want to inject the recommendations into
        "popup": __POPUP_ID__, // The popup id
        "conditions": false // We suggest to keep it on false, when it's true it will show only after the conditions are met from the Flashy UI
});

Add To Cart Button

If you want to allow visitors to add item to the cart directly from our AI product recommendations and you are using Custom Platform, you can easily do it by adding one function that will basically will be fired once a visitor click on add to cart, we will pass the popup_id + the item_id that you need to add to the cart.

Here is the example code, you need to create an endpoint or use new one.

window.FlashyAddToCart = async function FlashyAddToCart(item_id, popup_id = null, callback = null) {

	let formData = {'item_id': item_id};

        // Use existing function or send new request to add item to the cart

	fetch("https://put-your-website-here.com/add-to-cart", {
		method: 'POST',
		headers: {'Content-Type': 'application/json'},
		body: JSON.stringify(formData)
	}).then(response => {
		callback();
	}).catch((error) => {
		console.error('Error:', error);
	});
	
}

To test it, you can write in console on the browser:

FlashyAddToCart("15988", 0)

Design Your Own Product Recommendation

Unlock the full potential of personalized product recommendations on your e-commerce site with our AI-powered JavaScript SDK. This tool allows you to seamlessly integrate custom-designed recommendation elements that align with your website's unique style, enhancing the shopping experience for your customers.

How It Works: Use our SDK to fetch personalized recommendations based on the 'Weblayer' configurations set in our dashboard. This flexibility means you can update the recommendation logic anytime without altering your website's code.

window.addEventListener('onFlashy', async function() {

	let recommendations = await flashy.recommendations.get(__WEBLAYER_ID__);

});

Remember to replace __WEBLAYER_ID__ with your specific Weblayer ID.

Enhance AI Performance: Help our AI learn and improve by reporting user interactions with the recommendations. This feedback loop ensures increasingly accurate and effective suggestions over time.

Click Event: Track when users click on a recommendation, leading them to the product page. This data enriches the AI's understanding of user preferences and behaviors.

flashy('amplify:Click', {
	'popup_id': __WEBLAYER_ID__,
	'content_ids': ["item_id"]
});

Ensure WEBLAYER_ID matches your designed Weblayer.

Add To Cart Event:

If your design allows direct addition to the cart, inform us about these interactions. It's crucial for understanding the conversion effectiveness of the recommendations.

flashy('amplify:AddToCart', {
	'popup_id': __WEBLAYER_ID__,
	'content_ids': ["item_id"],
	'value': 100,
	'currency': 'USD'
});

Again, ensure WEBLAYER_ID is correctly set.

Sending Purchase Event

If you are currently sending Purchase events to Flashy from backend, you also need to add an event of Purchase from frontend for the Product Recommendations.

The event is very simple:

<script>
    flashy('amplify:Purchase', {
	    'content_ids': ["product_id"],
	    'value': 100,
	    'currency': 'USD',
	    'order_id': '__ORDER_ID__'
    });
</script>