# Install FlowConsent on WooCommerce

On WooCommerce, paste the FlowConsent snippet in WPCode (Code Snippets → Header & Footer), then take control of extension pixels and test your checkout flow.

> Canonical: https://www.flowconsent.com/en/doc/install-woocommerce
> Last updated: 2026-10-01
A WooCommerce store is a WordPress site: the FlowConsent snippet goes in the same place, at the top of the **Header** field of the WPCode plugin (**Code Snippets → Header & Footer**) or in a child theme. Plan for four steps: paste the snippet, take back control of the pixels injected by your store's marketing extensions, configure caching, then test the checkout flow. The main trap: Google Analytics for WooCommerce, Meta for WooCommerce and other tracking extensions add their own scripts, often above the banner.

## Before you start

- An account on [app.flowconsent.com](https://app.flowconsent.com) (the Free plan is free, no credit card, up to 25,000 sessions per month).
- A banner created and deployed: through your own Cloudflare account on the Free plan ([Cloudflare guide](/en/doc/cloudflare-deployment)), in one click on Pro and Enterprise.
- Administrator access to WordPress, and ideally a staging copy of the store to test payments.

## Step 1: Paste the snippet in the head

Copy the snippet from **Builder → Deployment → Integration**, **HTML / No-code** tab:

```html title="Code Snippets → Header & Footer → Header"
<script>
// FlowConsent Loader - place BEFORE any other script in the <head>
window.dataLayer=window.dataLayer||[];
function gtag(){dataLayer.push(arguments);}
gtag('consent','default',{
  'ad_storage':'denied',
  'analytics_storage':'denied',
  'ad_user_data':'denied',
  'ad_personalization':'denied',
  'wait_for_update':500
});
gtag('set','url_passthrough',true);
gtag('set','ads_data_redaction',true);
</script>
<!-- FlowConsent CMP -->
<script src="https://YOUR-LICENSE-CODE.consent.flowconsent.com/cookie-manager.js?code=YOUR_LICENSE_CODE"></script>
```

Install the **WPCode** plugin from the **Plugins** menu, open **Code Snippets → Header & Footer**, paste the snippet at the very top of the **Header** field, above any other code, and save. Plugin-free alternative: a child theme that hooks the snippet to `wp_head` with priority `1`. Both methods are covered in the [WordPress guide](/en/doc/install-wordpress).

The snippet must come before any tracking script (Google Analytics, Meta Pixel, Google Tag Manager…): anything placed above it escapes prior blocking.

## Step 2: Take control of your marketing extensions

This is what sets a store apart from a brochure site. Each tracking extension injects its script in its own way.

**Google Analytics for WooCommerce** (settings in **WooCommerce → Settings → Integration → Google Analytics**) loads `gtag` and sets its own Consent Mode defaults, which can take precedence over FlowConsent's. Two options:

- keep the extension for its ecommerce events, use the installation assistant to confirm its `gtag` lands **below** the FlowConsent stub, and if the defaults conflict, adjust them with the `woocommerce_ga_gtag_consent_modes` filter documented by WooCommerce;
- or remove the measurement ID from the extension and declare Google Analytics in **Builder → Services**, so the banner loads it only after consent.

**Meta for WooCommerce** (formerly Facebook for WooCommerce, settings in **Marketing → Facebook**) injects the Meta Pixel automatically. To have the pixel loaded only by the banner, turn off the extension's pixel with the official `facebook_for_woocommerce_integration_pixel_enabled` filter (in your child theme's `functions.php` or a WPCode PHP snippet), then declare Meta Pixel in **Builder → Services**.

```php title="Child theme functions.php"
add_filter( 'facebook_for_woocommerce_integration_pixel_enabled', '__return_false' );
```

> [!WARNING]
> Meta for WooCommerce also enables Meta's **Conversions API**, which sends events from your server. No banner of any kind can block a server-to-server call: decide how you use it with your DPO, separately from the banner.

The same logic applies to other ad pixels (Google Ads, TikTok, Pinterest…): remove the ID from the extension settings and declare the service in **Builder → Services**.

## Step 3: Caching and minification

WooCommerce asks you to exclude the **Cart**, **Checkout** and **My Account** pages from caching, and advises against JavaScript minification with some caching plugins. For the banner, also exclude the Consent Mode stub (`FlowConsent Loader`) and the `consent.flowconsent.com` domain from "defer" or "delay JavaScript" options. Then clear every cache (plugin, host, CDN).

## Step 4: Test the checkout flow

> [!NOTE]
> Payment gateways load their own scripts on the checkout page. After installation, place a test order with cookies **refused**, on staging or in your gateway's test mode: cart, checkout and confirmation must work normally, and the banner must not hide any payment field on mobile.

## Verify the installation

1. In a private window, the banner shows on the home page, a product page and the cart.
2. In the **Network** tab, no request to Google, Meta or other third parties before **Accept**.
3. The **installation assistant** (**Builder → Integration**) checks the live page: loader present with your license code, Consent Mode stub present, stub placed before every Google tag ([guide](/en/doc/setup-wizard)).
4. A **refusal scan** from the **Compliance** tab confirms nothing fires after a refusal ([compliance verification](/en/doc/compliance-verification)).

## Do it from your AI agent (MCP)

FlowConsent's official MCP server, `https://mcp.flowconsent.com`, works with Claude, ChatGPT or any MCP client, with an OAuth 2.0 connection to your FlowConsent account (no API key). Your agent fetches the snippet and placement instructions (`get_banner_snippet`, `get_setup_instructions`), verifies the installation with a real scan (`verify_consent_compliance`) and can set up recurring monitoring (`monitor_compliance`), handy for catching a pixel re-enabled by an extension update. It does not edit your store: pasting the snippet and changing extension settings stay on your side.

Example request: "Give me my banner snippet for my WooCommerce store and check that it is installed correctly on https://mystore.com".

See the [MCP server guide](/en/doc/mcp-server) and the [FlowConsent MCP](/en/mcp) page.

## Frequently asked questions

### Do I lose ecommerce data when visitors refuse cookies?

Visitors who refuse get no measurement cookies. With Consent Mode v2, Google tags then send cookieless signals that Google uses for conversion modeling. Details in the [Consent Mode guide](/en/doc/google-consent-mode).

### Can I load FlowConsent through Google Tag Manager?

No: loaded from GTM, the banner arrives too late for prior blocking. Place the snippet in the `<head>` above the GTM container; non-Google tags need "Additional consent settings".

### Can an extension update re-enable a pixel?

Yes, it often happens after a version change or a reconfiguration. Recurring monitoring from the **Compliance** tab, or `monitor_compliance` over MCP, catches it without waiting for a manual audit.

### Does a headless store need a different setup?

Yes. If your storefront is a React, Vue or Next.js app with client-side navigation, turn on **SPA mode** in the banner settings ([Next.js guide](/en/doc/nextjs-integration)).