Skip to main content
Dema’s tracking pixel ensures that your site captures all key events (page views, product views, and orders) accurately and in near real-time. Pick the method that matches your platform, then verify that events are coming in.

​
Choose your tracking method

Shopify

Install the Dema app — its web pixel captures key events automatically, with no manual code

Google Tag Manager

Add Dema as Custom HTML tags in your GTM container, fed by your data layer

Server-side tracking

Send events from your server straight to Dema’s tracking endpoint for maximum reliability and privacy
The Shopify pixel is built on Shopify’s Web Pixel API. Using GTM? The overview below walks through what a setup involves before you open the full guide.
Integrations built on the original server-side API are covered in Server-side tracking (deprecated). New integrations should use Server-side tracking V2.

​
Google Tag Manager setup

GTM tracking uses Dema’s V2 event API: every event is a Custom HTML tag that calls a single dema.event() method with data from your data layer. This section gives you the full picture of a setup; the Google Tag Manager guide has the tag code for every event.

​
Before you start

GTM on your site

Google Tag Manager installed and running on your website

Ecommerce data layer

Product, cart and transaction data pushed to the data layer

Your Dema ID

Your unique ID, formatted as DV-XXXXXXXXXXXXXXXXXXXXXXXX
A Google Analytics 4 ecommerce data layer works for most fields. Map any fields GA4 doesn’t define, such as ecommerce.shipping_country, customer.id and each item’s item_sku, from wherever your data layer holds them.

​
Setup steps

1

Create the GTM variables

Create a Constant variable, {{Dema > ID}}, that holds your Dema ID. If your site is a single-page application and you don’t already have a referrer variable, also create the {{JS > Referrer}} Custom JavaScript variable, which keeps the referrer consistent across all events on the same page view. See GTM variables.
2

Set up cookie consent

Choose a consent strategy — Stage + flush is the default and recommended choice. For Stage + flush, you create a {{Consent - Statistics}} variable for your consent management platform (CMP) and one shared flush tag. See Cookie consent.
3

Add the core event tags

Add the page_view, view_item and purchase tags. page_view fires on All Pages; the others fire on their data layer events. Keep the stub initializer that every tag includes — it stops events from being lost when a tag fires before the library has loaded, for example when a visitor lands on the order confirmation page straight from an email. See Core event tags.
4

Add the optional event tags

Add the optional tags for the events your data layer already pushes, such as add_to_cart and begin_checkout. See Optional event tags.
5

Preview, verify and publish

Test the container in GTM Preview mode and check the requests in your browser, as described in Verifying events, before you publish.

​
Events to send

Send at least the three core events. The optional events aren’t required, but are recommended. Dema events must be gated by cookie consent. There are two strategies:
Each event tag checks the {{Consent - Statistics}} variable. When consent is granted, the tag sends the event with dema.event(); when it isn’t, the tag queues it with dema.addToQueue(). A shared flush tag calls dema.emitPendingEvents() to send the queue once consent is granted.
  • Trigger the flush tag on your CMP’s consent data layer event, for example cookie_consent_update for Cookiebot or OneTrustGroupsUpdated for OneTrust.
  • The flush must also run on returning visits, when the CMP reads its existing cookie and pushes the same consent event — otherwise events queued earlier on that page load stay in the queue.
  • Don’t attach the event triggers (view_item_list, purchase, …) to the flush tag. Its only job is to drain the queue.
The guide has ready-made {{Consent - Statistics}} variables for Cookiebot, OneTrust, Usercentrics, Iubenda and Google Consent Mode v2. See Cookie consent.
Why Stage + flush is the default: events often fire before consent is settled — the visitor hasn’t answered the banner yet, or the CMP hasn’t written consent into GTM yet. GTM native gating drops those events. Stage + flush keeps them in sessionStorage and sends them as soon as consent is granted, even if the visitor has moved to another page in the same tab.

​
Good to know

By default, the visitor’s country is resolved from their IP address. To set it yourself, for example from the shipping country selected on your site, add country to the event payload. See Overriding the country.
On single-page applications (SPAs), pages change without a full page load, so events must fire on every navigation or route change. document.referrer also doesn’t update on client-side navigation — the {{JS > Referrer}} variable from the GTM variables step bridges that gap.If your tags call dema.pageview, see Set up tracking with single page applications.
The event_name field is open-ended. You can send your own events, such as quiz_completed or search_performed, and Dema can build custom metrics on top of them. Use snake_case and avoid the names of the built-in events. The available fields are listed in the event data schema.

​
Verifying events

Once the Dema pixel is implemented, verify that events are being tracked correctly:
1

Check the tags in GTM Preview

For GTM setups, open your site with the container in Preview mode, trigger an event and confirm that the matching Dema tag fires on the expected trigger. Also check the consent event name your CMP pushes to the data layer — some setups customise it.
2

Check the browser's network tab

Open the Network tab in your browser’s developer tools, trigger an event (for example, load a page or view a product) and look for requests sent to Dema’s endpoint (https://tracker.dema.ai).
3

Check the Dema dashboard

Navigate to the Real-Time Dashboard in Dema and verify that events appear shortly after they occur (typically within 3 minutes).
4

Test different scenarios

Test on multiple devices and browsers to ensure consistent tracking. Check campaign attribution by visiting your site with UTM-tagged URLs (for example, utm_source=google).

​
Troubleshooting

  • Script loading: use your browser’s developer tools to confirm the tracking script loads and requests reach Dema’s endpoint.
  • GTM triggers: make sure triggers are configured correctly and fire under the expected conditions.
  • Stub initializer: every tag that calls dema.* needs the stub. Without it, an event that fires before the library is initialized is lost.
  • Ad blockers: confirm that ad blockers or privacy settings aren’t preventing the script from running.
With Stage + flush, set page_location: location.href and page_referrer explicitly on every queued event. The library only captures these when dema.event() actually runs — for queued events, that’s when the flush tag fires, which can be on a different page.
  • Multiple scripts: make sure the Dema script isn’t implemented in more than one place (for example, both in GTM and directly in the site code).
  • Duplicate tags: review your GTM container to confirm tags aren’t firing more than once.
Dema uses its own session logic and fetches orders directly from your e-commerce platform, so its numbers can differ from GA4 or Shopify analytics. See Fundamentals: Tracking for a breakdown of the differences.

​
Need help?

Contact support

Email us at support@dema.ai for further assistance

Fundamentals: Tracking

How sessions, referrals and internal traffic work, plus more troubleshooting