To enhance tracking and gain insights into customer interactions on headless stores, PushOwl has provided functions for integrating email events. These functions can be easily incorporated into headless store setups.
Cart Sync
To make sure the cart items are synced across your headless store and PushOwl backend whenever the cart is updated, you need to trigger an API to sync the cart with the PushOwl backend. If you have email enabled, you don't need to follow this and, the payload should look like:
const pushowlCart = {
"affiliation": "rafi-brevo-test-store",
"currency": "INR",
"discount": 0,
"discount_taxinc": "",
"items": [
{
"available_now": true,
"description_short": "This is a gift card for the store",
"disc_amount": 10,
"disc_amount_taxinc": "",
"disc_rate": "",
"id": 49045631107383,
"image": "https://cdn.shopify.com/s/files/1/0880/1491/3847/files/gift_card.png?v=1716806979",
"name": "Gift Card - $10",
"price": 10,
"price_predisc": "",
"price_predisc_taxinc": "",
"price_taxinc": "",
"quantity": 1,
"size": "",
"sku": "",
"tax_amount": "",
"tax_name": "",
"tax_rate": "",
"url": "https://rafi-brevo-test-store.myshopify.com/products/gift-card?variant=49045631107383",
"variant_id": 49045631107383,
"variant_id_name": "$10"
}
],
"shipping": "",
"shipping_taxinc": "",
"subtotal": "",
"subtotal_predisc": "",
"subtotal_predisc_taxinc": "",
"subtotal_taxinc": "",
"tax": "",
"total": 10,
"total_before_tax": "",
"url": "https://rafi-brevo-test-store.myshopify.com/cart",
"id": "Z2NwLWFzaWEtc291dGhlYXN0MTowMUhaS0NaMkpLU1ozMEtINTBWQkIzQUJHMA"
};
window.pushowl.trigger('syncCart', pushowlCart);
You need to provide values for the keys mentioned above or empty values in case you don't have the required data.
Sync Product View
Every time a customer views a product, we can track that event to gain a deeper understanding of customer behavior and gather insights. If you're following this doc, then you don't need to use this. To sync a product view with the PushOwl backend on every product page, use the following code:
window.pushowl.trigger('syncProductView', {
"featured_image": "https://cdn.shopify.com/s/files/1/0880/1491/3847/files/gift_card.png?v=1716806979",
"gid": "gid://shopify/Product/9597114089783",
"id": 9597114089783,
"price": 10,
"title": "Gift Card",
"type": "giftcard",
"url": "https://rafi-brevo-test-store.myshopify.com/products/gift-card",
"vendor": "Snowboard Vendor",
"variants": [
{
"id": 49045631238455,
"name": "Gift Card - $100",
"price": 10000,
"public_title": "$100",
"sku": ""
},
{
"id": 49045631107383,
"name": "Gift Card - $10",
"price": 1000,
"public_title": "$10",
"sku": ""
},
{
"id": 49045631140151,
"name": "Gift Card - $25",
"price": 2500,
"public_title": "$25",
"sku": ""
},
{
"id": 49045631205687,
"name": "Gift Card - $50",
"price": 5000,
"public_title": "$50",
"sku": ""
}
]
});
All fields except id
can be left empty if necessary.
Track Category Page
Headless stores don't have a predictable way of tracking product category pages so, to track product categories better, you can implement the following event for pages dedicated to specific product categories:
window.pushowl.trigger('trackCategoryPage', {
categoryName: 'category name'
});
Identify
If you are using custom email opt-in or popup to collect an email you can call the following method on form submission
window.pushowl.trigger('identify', {
email: 'test@email.com',
properties: {
browser: 'Chrome' // Optional custom properties
}
});
This will result in the email submitted in your custom form to receive automations
Sync Page Name
To better track the pages a customer visits while browsing the store and to create email automations, you can implement this event as follows:
window.pushowl.trigger('syncPageName','Page name');
Page name is optional
Custom events
If you want to send custom events you can do so by calling the following method
window.pushowl.trigger('track', {
eventName: 'clicked discount button',
eventData: { data:{ discount: '123' } }
});