Skip to main content

Custom Events

Fast Simon Upsell & Cross-Sell dispatching custom events for any use like analytics and more. This way you are able to targeting important events at the moment they fired.

Getting Started​

PLP custom events​

  1. Register an event listener using a script tag located in the <head>
  2. Each time an event is fired within the PLP, we will dispatch the custom event including all the relevant data.

Register a new custom event listener & run a callback once fired​

<script>
    function productAddedToCartCallback(productData) {
        // ...code here
    }
    window.addEventListener('fs-rec-custom-events-product-added-to-cart', (e) => {
        productAddedToCartCallback(e.detail);
    });
</script>

Available Events​

Event NameDescriptionEvent Data
"fs-rec-custom-events-add-to-cart-click"Event is fired on product add to cart clickproductData: Product
"fs-rec-custom-events-product-added-to-cart"Event is fired each time product added to the cartproductData: Product
"fs-rec-custom-events-quick-view-btn-clicked"Event is fired when clicking on quickview button{productId: string, productURL: string }
"fs-rec-events-product-quick-add-clicked"Event is fired when clicking on quick add buttonproductData: Product
"fs-rec-events-product-swatch-on-click"Event is fired when clicking on color swatch option button{alt: AlternativeProduct[], image: string, sku: string, redirectURL: string, title: string}

type references: Typescript Types