The following guide requires knowledge of code and javascript, we suggest passing this onto your developer if you're not familiar with it
When using our embeds, Shoprocket automatically triggers events when users take actions within your store. You can listen for these events in your own website/application and create custom behaviours or setup tracking for logs and marketing performance purposes.
Before trying to register a listener to a Shoprocket event, you should wait for Shoprocket to be ready, you can do this like so:
Wait for Shoprocket to be ready
<script type="text/javascript"> window.addEventListener('shoprocket_ready', () => { // Shoprocket is ready, you can add your code here }); </script>
The full list of Shoprocket events available:
In this example, we are simply logging the event response to console so that you can see what data is returned
<script type="text/javascript"> window.addEventListener('shoprocket_ready', () => { // Listen for a page view Shoprocket.events.listen('page.viewed', (event) => { console.log(event); }); // Listen for a product view Shoprocket.events.listen('product.viewed', (event) => { console.log(event); }); // listen for item added to cart Shoprocket.events.listen('cart.item_added', (event) => { Shoprocket.toggleCart(); }); // Listen for an item being removed from cart Shoprocket.events.listen('cart.item_removed', (event) => { console.log(event); }); // Listen for cart being opened Shoprocket.events.listen('cart.opened', (event) => { console.log(event); }); // Listening for cart being closed Shoprocket.events.listen('cart.closed', (event) => { console.log(event); }); // Listen for cart item quantity change Shoprocket.events.listen('cart.quantity_updated', (event) => { console.log(event); }); // Listen for the address section viewed in cart Shoprocket.events.listen('cart.address_viewed', (event) => { console.log(event); }); // Listen for the shipping options section viewed in cart Shoprocket.events.listen('cart.shipping_viewed', (event) => { console.log(event); }); // Listen for shipping stage of checkout bypassed (free shipping or digital goods only) Shoprocket.events.listen('cart.shipping_bypassed', (event) => { console.log(event); }); // Listen for payment methods section viewed Shoprocket.events.listen('cart.payment_methods_viewed', (event) => { console.log(event); }); // Listen for cart payment method selection Shoprocket.events.listen('cart.payment_method_selected', (event) => { console.log(event); }); // Listen for order summary section viewed (pre order placed) Shoprocket.events.listen('cart.summary_viewed', (event) => { console.log(event); }); // Listen for an order being initialized Shoprocket.events.listen('order.initialized', (event) => { console.log(event); }); // Listen for order update (post order placed) Shoprocket.events.listen('order.updated', (event) => { console.log(event); }); // Listen for order payment status (post order placed) Shoprocket.events.listen('order.payment_status', (event) => { console.log(event); }); }); </script>