Fix guide · Any website · medium · about 30 min

TikTok Pixel fires before cookie consent: how to fix it

For the finding “TikTok Pixel fires before cookie consent”. Also for: Shopify, WordPress, Webflow, Framer.

What this means

Your site shows a cookie banner, but the TikTok Pixel sent data to TikTok while that banner was still waiting for an answer. The banner is on screen, yet it is not controlling the pixel.

TikTok’s standard base code sends a page view as soon as it loads: it ends with ttq.load('<PIXEL ID>'); ttq.page();. Unless something holds it back, it measures every visitor from the first second.

Why it costs you money:

  • If you advertise to people in the EU, sending marketing data before consent is a legal risk you probably did not intend to take. TikTok itself asks advertisers to provide notices and obtain consents as required by applicable laws. We report the technical behaviour only; we cannot tell you whether your setup is compliant.
  • It usually means the banner and your tags are not connected at all. When this gets fixed in a hurry, the common result is the opposite problem: the pixel stops firing completely and your TikTok campaigns lose their data.
  • Your TikTok numbers mix consented and unconsented visitors, so they will shift unexpectedly once the setup is corrected.

How to confirm it yourself

Our check runs from a browser in the EU, so the site behaves as it would for an EU visitor. If your banner only appears in some countries, use a VPN or ask a colleague there.

  1. Open a private (incognito) window, so no earlier consent choice is remembered.
  2. Open the browser’s developer tools (F12, or right-click and choose Inspect), go to the Network tab and type analytics.tiktok.com/api into the filter box.
  3. Load your page. Do not click anything on the cookie banner.
  4. If requests to analytics.tiktok.com/api/v2/pixel appear while the banner is still on screen, the pixel is sending events before consent. Click one and look at its payload: event is the event name (for example Pageview) and context.pixel.code is your pixel ID. Requests that only load the library (events.js and other script files) are not events.
  5. Open the Application tab (Chrome) or Storage tab (Firefox), then Cookies for your domain. TikTok’s first-party cookies _ttp (browser ID), ttclid (ad click ID) and ttcsid_… are advertising cookies. If they appear before you answer the banner while the pixel is supposed to be blocked (by your consent tool or Google Tag Manager), the pixel ran without consent. TikTok does not document whether its own consent mode (ttq.holdConsent(), below) also holds back cookies, so with that route judge by the event requests.

You can also check with the TikTok Pixel Helper Chrome extension (it lists the pixel’s events on the page), or in TikTok Events Manager: open Tools > Events > Data sources, select your pixel and open Test Events. Open your site from there and watch whether a page view arrives before you accept cookies.

How to fix

The goal: the pixel must not send anything until the visitor has accepted marketing cookies, and it should send the page view right after they accept, on the same page. How you get there depends on how the pixel is installed. Find out first.

  1. Find every place the pixel is installed. Search the page source (right-click, View page source) for analytics.tiktok.com and ttq.load. Check your site’s header code or theme settings, your Google Tag Manager (GTM) container (the TikTok Pixel template and Custom HTML tags), and any plugins or apps (shop integrations such as TikTok’s own apps, tracking plugins, server-side tools). The fix only works if every copy goes through your consent setup.
  2. Pick one way to gate the pixel and remove the others.
    • TikTok’s cookie consent mode. TikTok documents a “default opt-out” mode. Its standard base code does not include the consent commands, so add them in two places:

      1. In the loader part of the base code, add "holdConsent", "revokeConsent", "grantConsent" to the ttq.methods list.
      2. Call ttq.holdConsent() before ttq.load(...):
      ttq.holdConsent();
      ttq.load('<YOUR PIXEL ID>');
      ttq.page();
      
      // When the visitor accepts marketing cookies:
      ttq.grantConsent();
      // When they reject:
      ttq.revokeConsent();

      With holdConsent(), TikTok queues events instead of sending them. grantConsent() sends them, including the ones queued earlier in the session, so the landing page view is not lost. revokeConsent() drops the queue. Connect grantConsent() to your consent tool’s “consent given” event, and call it on every page for visitors who accepted earlier. TikTok asks you to implement this on every page where the pixel is installed.

    • Your consent tool (CMP) blocks the script. Most consent tools can hold back a script until the visitor accepts a category: you change the script’s type and add a category attribute, or let the tool block known trackers automatically. Put the TikTok base code in the marketing (advertising) category, following your tool’s documentation; attribute names differ from tool to tool. If other code calls ttq.track(...) directly, it must not run before the base code has been released.

    • Google Tag Manager. Install the pixel only through GTM (TikTok’s own setup flow in Events Manager creates the tags for you). TikTok’s TikTok Pixel template has no consent fields of its own, so in each TikTok tag’s Advanced Settings > Consent Settings, choose Require additional consent for tag to fire and add ad_storage (plus ad_user_data if your setup uses it). This works only if your consent tool sends Google Consent Mode updates to GTM; TikTok recommends Google Consent Mode for GTM users. Then make sure the tag’s trigger still fires after consent is given on the same page (see “TikTok Pixel does not fire after consent”).

  3. Make the “accept” path work on the same page. After a visitor clicks “Accept”, the pixel should start right away, not only on the next page. With TikTok’s consent mode this happens through grantConsent(); with blocking or GTM, check that the released tag sends the page view without a reload.
  4. Publish your changes and clear any site or CDN cache.

Common causes

  • The TikTok base code was pasted into the site header (or a theme setting), and the cookie banner was added later as a separate widget that does not know about it.
  • The pixel is a GTM tag without a consent requirement. GTM’s Consent Mode adjusts Google tags automatically; a TikTok tag needs its own consent setting.
  • A shop app or plugin injects its own TikTok pixel that ignores the consent tool.
  • ttq.holdConsent() is called after ttq.load() and ttq.page(), so the first page view has already left.
  • The consent tool runs in “notice only” or “implied consent” mode, or is configured to block scripts only outside the EU.
  • The consent tool’s script loads after the pixel, so the pixel has fired before blocking can start.

How to verify the fix

  1. Repeat the private-window test: no analytics.tiktok.com/api/v2/pixel requests before you answer the banner, and, if your consent tool or Google Tag Manager blocks the pixel, no _ttp or ttclid cookies yet.
  2. Click “Accept”: a page view request leaves within a few seconds, on the same page.
  3. In a fresh private window, click “Reject”: no page view or conversion events.
  4. Re-run the check on IsPixelWorking. The issue should be gone, and “TikTok Pixel does not fire after consent” should not appear in its place.

Questions people ask

Yes. TikTok’s pixel cookie consent mode uses ttq.holdConsent(), ttq.grantConsent() and ttq.revokeConsent(). The pixel does not read your banner or Google Consent Mode by itself, so your consent tool or your code has to call these commands.

Does revokeConsent delete data TikTok already received?

No. TikTok says calling ttq.revokeConsent() does not affect data already shared with TikTok; it only stops future (and queued) events.

Sources

Guides for your consent tool