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>
