@adhawk/flux-vision
v1.2.9
Published
Track End of Funnel Behavior in Shopify Liquid templates through Segment.io
Downloads
69
Readme
@adhawk/flux-vision
Tracks end of funnel E-Commerce data for your Shopify checkout.
Gather in-depth analytics about product information, checkout steps viewed, and purchases.
This package utilizes Segment.io to allow you to send data to any number of destinations including Google Analytics, Google Tag Manager and more.
Steps to install
- Go to your Shopify Checkout Theme and open the "Edit Code" dashboard. Open the
checkout.liquid
template file and add your Segment.io script within the<head>
tag like below:
<head>
<script type="text/javascript">
// insert your segment io script here
</script>
</head>
- Go to your Shopify Checkout Theme and open the "Edit Code" dashboard. Open the
checkout.liquid
template file and add the following to the end of the<body>
tag.
<div id="FLUX_VISION_DATASETS" style="display:none">
<div
id="checkout-data"
data-checkout-id="{{checkout.id}}"
data-order-number="{{checkout.order_number}}"
data-total-price="{{checkout.total_price}}"
></div>
{% for item in checkout.line_items %}
<div
id="product-item-for-analytics-dataset"
data-name="{{item.title}}"
data-sku="{{item.sku}}"
data-price="{{item.price}}"
data-quantity="{{item.quantity}}"
data-url="{{item.url}}"
></div>
{% endfor %}
</div>
- Then add the following script to import this package and automatically send
analytic.track()
events populated with checkout data.
<html>
<body>
<!-- ...body contents here -->
</body>
</html>
<!-- Add this script in after the </html> -->
<script src="https://unpkg.com/@adhawk/flux-vision"></script>
That's it!