Custom Events - Common Examples

A few example implementations of Voyage Custom Events across a variety of platforms

Table of Contents

Shopify

Product Viewed (by Product Tag)

Trigger an event when a product with a specific tag is viewed.

<script type="text/javascript">
{% if product.tags contains 'mytag' %}
 voyage.event(CUSTOM_EVENT_ID, {
productName: "{{ product.title }}",
productUrl: "{{ product.url }}",
});
{% endif %}
</script>

Product Viewed (by Collection Handle)

Trigger different events based on when specific products are viewed.

<script type="text/javascript">
{% if collection.handle == "product-one" %}
voyage.event(CUSTOM_EVENT_ID_1, { productName: "{{ product.title }}" });
{% elsif collection.handle == "product-two" %}
voyage.event(CUSTOM_EVENT_ID_2, { productName: "{{ product.title }}" });
{% elsif collection.handle == "product-three" %}
voyage.event(CUSTOM_EVENT_ID_3, { productName: "{{ product.title }}" });
{% endif %}
</script>


Query Parameters

UTM Parameters

Trigger an event when a query parameter exists on a URL.

const queryString = window.location.search; 
const urlParams = new URLSearchParams(queryString);
const campaignUtm = urlParams.get('utm_campaign');
if (campaignUtm === 'shopper_upsell') voyage.event(CUSTOM_EVENT_ID);