Installing the Pixel Copy and paste the following Liquid Code into your layouts/theme.liquid file before any JavaScript that utilizes the Layers API. Replace {{ PUT YOUR TRACKING API KEY HERE}} with the Tracking API Key found under Settings > API Access.
{% comment %} Start layers click tracking {% endcomment %} <script id="layers-config" type="application/json"> { "apiToken": "{{ PUT YOUR TRACKING API KEY HERE}}" } </script> {% comment %} theme-check-disable {% endcomment %} <script id="layers-session-context" type="application/json"> { "path": {{ request.path | json }}, "cart_empty": {{ cart.empty? | json }}, "signed_in": {% if customer %} true {% else %} false {% endif %}, "cart_value": {{ cart.total_price | divided_by: 100.0 | json }}, "num_cart_items": {{ cart.item_count | default: 0 | json }}, "num_orders": {{ customer.orders_count | default: 0 | json }}, "average_order_value": {% if customer.orders_count > 0 %} {% assign customer_orders_count = customer.orders_count | plus: 0.0 %} {{ customer.total_spent | divided_by: customer_orders_count | divided_by: 100.0 | json }} {% else %} 0 {% endif %}, {% assign sorted_orders = customer.orders | sort: "created_at" %} {% assign time_diffs = 0 %} {% assign prev_date = nil %} {% assign interval_count = 0 %} {% assign oldest_order_date = sorted_orders.first.created_at | date: '%s' %} {% assign discount_without_coupon = 0 %} {% assign discount_with_coupon = 0 %} {% assign cart_discount_without_coupon = 0 %} {% assign cart_discount_with_coupon = 0 %} {% for order in sorted_orders %} {% if prev_date %} {% assign current_date = order.created_at | date: '%s' %} {% assign diff = current_date | minus: prev_date %} {% assign time_diffs = time_diffs | plus: diff %} {% assign interval_count = interval_count | plus: 1 %} {% endif %} {% assign prev_date = order.created_at | date: '%s' %} {% for discount in order.discount_applications %} {% assign discount_amount = discount.total_allocated_amount %} {% if discount.type == 'discount_code' %} {% assign discount_with_coupon = discount_with_coupon | plus: discount_amount %} {% else %} {% assign discount_without_coupon = discount_without_coupon | plus: discount_amount %} {% endif %} {% endfor %} {% endfor %} {% for discount in cart.discount_applications %} {% assign discount_amount = discount.total_allocated_amount %} {% if discount.type == 'discount_code' %} {% assign cart_discount_with_coupon = cart_discount_with_coupon | plus: discount_amount %} {% else %} {% assign cart_discount_without_coupon = cart_discount_without_coupon | plus: discount_amount %} {% endif %} {% endfor %} "days_between_orders": {% if interval_count > 0 %} {{ time_diffs | divided_by: interval_count | divided_by: 86400 | json }} {% else %} null {% endif %}, "days_since_last_order": {% if customer.last_order %} {% assign last_order_date = customer.last_order.created_at | date: '%s' %} {% assign current_date = 'now' | date: '%s' %} {{ current_date | minus: last_order_date | divided_by: 86400 | json }} {% else %} null {% endif %}, "days_since_oldest_order": {% if sorted_orders.size > 0 %} {% assign current_date = 'now' | date: '%s' %} {{ current_date | minus: oldest_order_date | divided_by: 86400 | json }} {% else %} null {% endif %}, "total_spent": {{ customer.total_spent | divided_by: 100.0 | json }}, "discount_value_without_coupon": {{ discount_without_coupon | divided_by: 100.0 | json }}, "discount_value_with_coupon": {{ discount_with_coupon | divided_by: 100.0 | json }}, "cart_discount_value_without_coupon": {{ cart_discount_without_coupon | divided_by: 100.0 | json }}, "cart_discount_value_with_coupon": {{ cart_discount_with_coupon | divided_by: 100.0 | json }}, "items_purchased": [ {% assign first_item = true %} {% for order in sorted_orders %} {% for line_item in order.line_items %} {% if line_item.product_id and line_item.variant_id %} {% if first_item %} {% assign first_item = false %} {% else %} , {% endif %} { "transaction_id": {{ order.id | json }}, "variant_id": {{ line_item.variant_id | json }}, "product_id": {{ line_item.product_id | json }}, "sku": {{ line_item.sku | json }}, "product_type": {{ line_item.product.type | json }}, "option1": {{ line_item.variant.option1 | json }}, "option2": {{ line_item.variant.option2 | json }}, "option3": {{ line_item.variant.option3 | json }}, "time": {{ order.created_at | date: "%Y-%m-%dT%H:%M:%S%z" | json }} } {% endif %} {% endfor %} {% endfor %} ], "cart_items": [ {% assign first_cart_item = true %} {% for item in cart.items %} {% if item.product_id and item.variant_id %} {% if first_cart_item %} {% assign first_cart_item = false %} {% else %} , {% endif %} { "variant_id": {{ item.variant_id | json }}, "product_id": {{ item.product_id | json }}, "product_type": {{ line_item.product.type | json }}, "quantity": {{ item.quantity | json }}, "option1": {{ item.variant.option1 | json }}, "option2": {{ item.variant.option2 | json }}, "option3": {{ item.variant.option3 | json }} } {% endif %} {% endfor %} ] } </script> <link rel="dns-prefetch" href="https://cl.uselayers.com"> {% comment %} theme-check-enable {% endcomment %} <script src="https://cdn.uselayers.com/pixel/layers-tracking-pixel.js" type="module"></script> {% comment %} End layers click tracking {% endcomment %} Please
contact support if you have any questions or could use some assistance installing the Storefront Pixel.
Events Captured by Pixel
Collection View
Product Click
Product View
Product Add to Cart
For information on forwarding these events to third-party analytics services like Microsoft Clarity and Blotout.io, see Third-Party Integrations .
Line Item Properties A Line Item Property with the key _layers_attribution is appended to some add to cart forms. The value corresponds to the identifier of the request made using the Search or Browse API where the customer last saw the product before adding it to their cart. This property is only added if the customer clicked on products from the Search or Browse APIs.
Order Attributes An Order Attribute with the key _layers_session_id is appended to some orders. The value is the Shopify Session ID of the customer.
Misc Browser Specs Supported
Back/Forward Cache.
Speculation Rules.
SPA Navigation.
