Launch AI widgets, enhance your data sets, enrich your campaigns across tools, and make clearer business decisions. To track events via your website, you will need to place a javascript pixel on the pages you wish to track interactions.
Our privacy policy and applicable terms requires you to refrain from sending us sensitive personal information about your users, including but not limited to social security numbers and credit card details.
How to Track Events via the Pixel
To enable more complex and insightful use cases, we track events as they happen. For example, you can notify AIQ when a user adds to their cart, watches a product video, or starts a live chat. Track almost any event and segment on it later using the schema below.
Note: The following is not needed if you are only using the pixel for the popup version of the signup form.
Navigate to Settings > Integrations > Website JS and click connect.
Save the integration.
To track a custom event you can call “aiq” after the required code above anywhere on the page. The example below illustrates creating and updating a shopper's info:
<script>aiq('customEventName', 'customEventValue');</script>
Custom Events
Event names will be available for use in your accounts audience builder after we have seen at least 1 in production.
Commonly Recognized Events
The following events are commonly used and therefore documented for your internal setup. Please note that we always track pages viewed so it is easy to segment audiences by page categories, brands viewed, products viewed, etc.
Event | Description | Code Example |
Contact | Sends contact record info into personas. Fields are optional. Build your forms as you please. WARNING: Passing mobilePhone with smsoptin: false, means that you want us to send that user an SMS asking to confirm their optin to your loyalty program. If you do not want this functionality, DO NOT pass the phone number. Additionally, only send smsoptin: true if you are certain a user is already part of your club and you do not want them to get the optin confirmation message. | <script? aiq('contact', { email: '[email protected]', mobilePhone: '9708399900', firstName: 'Jason', lastName: 'Bourne' birthdate: 1576274448, signedUp: 1576274448, ageGate: true, favoriteStore: "XYZ", smsoptin: false, loyalty: true, addr: {"city": "Somerville", "state":"MA", "street":"44 Green Street", "country": "USA", zipCode":"02143"}, "customAttributes": [{ "key": "testKey", "value": "testValue" }], "tosconsent": 1576274448 }); </script> |
Site search | User searched your site. | <script> aiq('siteSearch', 'The query they searched'); </script> |
Cart viewed | User viewed your cart | <script> aiq('cartViewed','1'); </script> |
Product added to cart | Product was put in a user's cart | <script> aiq('productAddedToCart', { cart_id: '1234' product_id: '222', sku: 'CBD_9028', category: 'Flower', name: 'OG Flower', brand: 'Aurora', unitPrice: 18.99, quanitity: 1, coupon: '420Sale', position: 3, url: 'https://yoursite.products/path', image_url: 'https://yoursite.com/images/ product.jpg' }) ; </script> |
Product removed from cart | Product was removed from a user's cart | <script> aiq('productRemovedFromCart', { cart_id: '1234' product_id: '222', }) ; </script> |
Checkout started | Checkout flow has started | <script> aiq('checkoutStarted', '1'); </script> |
Checkout step viewed | A new step of checkout flow has started i.e. "Shipping info", "Coupon info" etc. | <script> aiq('checkoutStepViewed' ,'2'); </script> |
Order completed | An order was completed. You can pass the items in the order and other detailed information. | <script> aiq('orderCompleted', { orderID: 'pine12394', totalPrice: 27.50, totalCost: 27.50, totalTax: 2, discount: 2.5, coupon: 'giftCardCode', currency: 'USD', products: [ { sku: 'IQ12394', name: 'Monopoly, 3rd Edition', price: 19, quantity: 1, category: 'Flower', url: 'https://yoursite.com/products/path', image_url: 'https://yoursite.com/images/ product.jpg' }, ] }); </script> |
Email link clicked | The user has arrived at current page by clicking email link. | <script> aiq('emailLinkClicked', 'https://mylink.com'); </script> |
Text link clicked | The user has arrived at current page by clicking a text link. | <script> aiq('textLinkClicked', 'https://mylink.com'); </script> |
Live chat convo started | Live chat conversation has started | <script> aiq('liveChatStarted', '1'); </script> |
Live chat convo ended | Live chat conversation has ended | <script> aiq('liveChatEnded', '1'); </script> |
Live chat message sent | Your live chat agent has sent a message. | <script> aiq('liveMessageSent', 'Body of message'); </script> |
Live chat message received | Our live chat agent has received a message. | <script> aiq('liveMessageReceived', 'Body of message'); </script> |
Video started | A video has been started by user. | <script> aiq('videoStarted', {name: 'my video', timestamp: '157627448'}); </script> |
Video ended | A video a user has been watching has finished playing. | <script> aiq('videoEnded', {name: 'my video', timestamp: '157627448'}); </script> |
Experiment viewed | A/B testing experiment has been viewed. You can use this to attribute performance. | <script> aiq('experimentViewed', {experimentID: '324', experimentName: 'my experiment', variationID: '123', variantName: 'variation name'}); </script> |
What the pixel does
One script tag gives you:
Page and session tracking — pageviews, referrer, timezone, device, sent to AIQ for identity resolution against your existing contacts.
Custom event tracking — cart, search, product, and purchase events via aiq() calls (see section 8).
Signup forms and surveys — popup signup forms and surveys configured in the AIQ dashboard render automatically, no extra code.
Widget delivery — the Pixel widget loads and initializes from the same SDK, including built-in store-location sync on several platforms, and chat features.
How to Add the Pixel to your Website
Do not pass sensitive personal data (SSNs, payment card numbers) to the pixel. This is prohibited by the AIQ terms and applicable privacy policy.
1. Before you start
You need two things:
Your UID — the numeric AIQ org/store ID. Find it in the AIQ dashboard, or read it off any dashboard URL: https://lab.alpineiq.com/settings/{UID}/...
The snippet — AIQ dashboard → Settings → API & Tracking → Tracking Pixel. Copy the whole snippet. If you can't reach that page, the snippet is standard and reproduced below.
If the client is a multi-org account (separate UIDs per brand or per state), collect every UID you need to fire on the site.
2. The current embed code
Add this to the <head> of every page, as high in the <head> as practical:
<script async id="aiq" src="https://lab.alpineiq.com/aiq/sdk.js" data-ids="UID"></script>
Replace UID with the client's numeric UID. For multiple UIDs, comma-separate them with no spaces:
<script async id="aiq" src="https://lab.alpineiq.com/aiq/sdk.js" data-ids="1726,5191"></script>
Requirements — all three matter:
Requirement | Why |
id="aiq" | The SDK bootstraps by looking up script#aiq on the page. Without the id, nothing initializes. |
data-ids | How the SDK learns which UID(s) to report to. It will also accept ?ids= on the src as a fallback. |
One tag only | Two pixel tags means double-firing. The SDK detects duplicates and removes the extras, but do not rely on that — fix the source. |
async is recommended so the tag never blocks rendering.
If any of the above components are missing after installing the pixel, please double check your site’s plugins or anything that could be causing the script to be minified. The entire script is necessary for functionality.
Legacy embeds — replace, don't stack
If you find any of these on a site, it is on the old embed and should be migrated:
Legacy pattern | Notes |
lab.alpineiq.com/p/1234.js | Old AIQ pixel, per-UID path |
lab.alpineiq.com/p/?ids=1726,5191 | Old AIQ pixel, query-param form |
assets.terpli.io/TerpliPlugin.js | Old standalone Terpli widget |
<script id="terpliScript"> | Old standalone Terpli widget |
Remove the old tag in the same change that adds the new one. Running both at once is worse than either alone — you get duplicate pageviews and two widget instances competing for the same container.
Links to alpineiq.com/join/..., /wallet/..., or /loyalty/... are loyalty signup and wallet links, not the pixel. Leave them alone.
3. Site builders
For every platform below, the goal is identical: get the snippet from section 3 into the site-wide <head>. Only the admin path changes.
WordPress
Three options, best first.
Option A — header/footer plugin (recommended). Install WPCode, Insert Headers and Footers, or similar. Paste the snippet into the Header / wp_head box, set it to run site-wide, save. Survives theme updates and needs no code access.
Option B — child theme functions.php. Add to the active child theme:
add_action('wp_head', function () {
?>
<script async id="aiq" src="https://lab.alpineiq.com/aiq/sdk.js" data-ids="UID"></script>
<?php
}, 1);The priority of 1 puts the tag near the top of the <head>.
Option C — theme editor. Appearance → Theme File Editor → header.php, paste just before </head>. Fast, but a theme update will wipe it. Use a child theme if you go this route.
Page-builder themes (Divi, Elementor Pro, Astra) usually expose their own custom code panel — Divi: Theme Options → Integration → "Add code to the <head>". Either is fine; do not add it in two places.
Shopify
Online Store → Themes → ⋯ → Edit code → layout/theme.liquid. Paste the snippet immediately before </head> and save.
Notes:
Do this on the live theme, and repeat on any theme you later publish. Theme code does not carry across themes.
Do not use Settings → Customer events (Custom Pixels) for this. Those run in a sandboxed iframe with no access to the storefront DOM, so the widget and any DOM-based store sync will not work.
Shopify Plus with a separate checkout: add the tag to the checkout layout too if you need post-purchase events.
Squarespace
Settings → Developer Tools → Code Injection → Header. Paste, save. (On older 7.0 sites: Settings → Advanced → Code Injection.) Code Injection is a paid-plan feature; on a Personal plan you may need a plan upgrade.
Wix
Settings → Custom Code → + Add Custom Code. Paste the snippet, then set:
Add code to: All pages
Place code in: Head
Load once per: page
Name it "AIQ Pixel", apply, and publish the site — custom code does not go live until publish.
Webflow
Project Settings → Custom Code → Head Code. Paste, save, then Publish. For a specific-page-only install, use Page Settings → Custom Code → Head instead.
Duda / GoDaddy / Weebly and other builders
All of them have some equivalent of "site-wide header code injection":
Duda: Site → Settings → Head HTML
GoDaddy Website Builder: Settings → Site-wide code → Head
Weebly/Square Online: Settings → SEO → Header code
If a builder has no head-injection field at all, install via GTM (section 5) if GTM is already on the site, or ask the client's web team for <head> access. A pixel placed only in the footer or in a body widget will still track pageviews, but widget placement and store sync get less reliable.
4. Install via Google Tag Manager
Use GTM when you don't have <head> access, when the client already manages tags in GTM, or when you need to sequence the pixel ahead of another tag.
Note that the GTM container itself usually loads asynchronously, so a GTM-installed pixel initializes slightly later than a hardcoded one. For pageview tracking that is fine. If the client cares about first-paint widget rendering, hardcode it instead.
Step 1 — Create the tag
Tags → New → Tag Configuration → Custom HTML. Paste:
<script>
(function () {
// Don't double-install if the pixel is already on the page.
if (document.getElementById('aiq')) {
gtmOnSuccess();
return;
}
var s = document.createElement('script');
s.id = 'aiq';
s.async = true;
s.src = 'https://lab.alpineiq.com/aiq/sdk.js';
s.setAttribute('data-ids', 'UID'); // <-- replace UID (comma-separate for multiple)
s.onload = function () { gtmOnSuccess(); };
s.onerror = function () { gtmOnFailure(); };
document.head.appendChild(s);
})();
</script>
Replace UID. Keep id = 'aiq' and the data-ids attribute — the SDK will not initialize without the id, and will not report without the ids.
gtmOnSuccess() / gtmOnFailure() let GTM know whether the script loaded, which is what makes tag sequencing (step 3) work.
Step 2 — Configure the tag
Setting | Value |
Tag Name | AIQ – Pixel |
Tag Type | Custom HTML |
Trigger | Initialization — All Pages (falls back to All Pages if unavailable) |
Advanced → Tag firing options | Once per page |
Consent Settings | Set to require whatever consent type the client's CMP uses, if any |
Initialization — All Pages fires before the standard All Pages trigger, which gets the pixel in as early as GTM allows.
Step 3 — Sequencing (only if you have a second tag)
If you add a store-sync tag (section 7) or any tag that calls aiq(), open that tag → Advanced Settings → Tag Sequencing → check "Fire a tag before…" and select AIQ – Pixel. That guarantees the pixel exists before the dependent tag runs.
Step 4 — Preview, then publish
Use GTM Preview on the live site. Confirm the tag shows under "Tags Fired" and that sdk.js appears in the Network tab. Then Submit with a version name like AIQ pixel install — <date>.
Step 5 — Remove hardcoded duplicates
If the site also has a hardcoded pixel or a legacy /p/ tag, pull it out now. GTM plus a hardcoded tag is the most common cause of double-firing.
FAQ's
I have an outdated pixel stript, should I update it?
Yes! AIQ has been improving our pixel to ensure popup blockers and certain browsers do not blacklist/block our pixel and widgets. We recommend you have our most up-to-date version which can be located in API & Tracking.