Ein WooCommerce-Shop ist eine WordPress-Website: Der FlowConsent-Code gehört an dieselbe Stelle, ganz oben in das Feld Header des Plugins WPCode (Code Snippets → Header & Footer) oder in ein Child-Theme. Rechnen Sie mit vier Schritten: Code einfügen, die Kontrolle über die Pixel der Marketing-Erweiterungen zurückgewinnen, Cache konfigurieren und den Checkout testen. Die häufigste Falle: Google Analytics for WooCommerce, Meta for WooCommerce und andere Tracking-Erweiterungen fügen eigene Scripts ein, oft oberhalb des Banners.
Bevor Sie beginnen
- Ein Konto auf app.flowconsent.com (Tarif Free kostenlos, ohne Kreditkarte, bis zu 25.000 Sitzungen pro Monat).
- Ein erstelltes und bereitgestelltes Banner: im Tarif Free über Ihr eigenes Cloudflare-Konto (Cloudflare-Anleitung), in Pro und Enterprise mit einem Klick.
- Administratorzugang zu WordPress und idealerweise eine Staging-Kopie des Shops, um Zahlungen zu testen.
Schritt 1: Code in den Head einfügen
Kopieren Sie den Code aus Builder → Deployment → Integration, Tab HTML / No-code:
<script>
// FlowConsent Loader - VOR jedem anderen Script im <head> platzieren
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://IHR-LIZENZCODE.consent.flowconsent.com/cookie-manager.js?code=IHR_LIZENZCODE"></script>Installieren Sie das Plugin WPCode über das Menü Plugins, öffnen Sie Code Snippets → Header & Footer, fügen Sie den Code ganz oben in das Feld Header ein, über allem anderen Code, und speichern Sie. Alternative ohne Plugin: ein Child-Theme, das den Code mit Priorität 1 an den Hook wp_head hängt. Beide Methoden beschreibt die WordPress-Anleitung.
Der Code muss vor jedem Tracking-Script stehen (Google Analytics, Meta Pixel, Google Tag Manager…): Alles, was darüber steht, entgeht der vorherigen Blockierung.
Schritt 2: Marketing-Erweiterungen unter Kontrolle bringen
Hier unterscheidet sich ein Shop von einer reinen Unternehmenswebsite. Jede Tracking-Erweiterung fügt ihr Script auf eigene Weise ein.
Google Analytics for WooCommerce (Einstellungen unter WooCommerce → Settings → Integration → Google Analytics) lädt gtag und setzt eigene Consent-Mode-Standardwerte, die Vorrang vor denen von FlowConsent haben können. Zwei Optionen:
- die Erweiterung für ihre E-Commerce-Ereignisse behalten, mit dem Installationsassistenten prüfen, dass ihr
gtagunterhalb des FlowConsent-Stubs landet, und bei kollidierenden Standardwerten den von WooCommerce dokumentierten Filterwoocommerce_ga_gtag_consent_modesanpassen; - oder die Mess-ID aus der Erweiterung entfernen und Google Analytics unter Builder → Services deklarieren, damit das Banner es erst nach der Einwilligung lädt.
Meta for WooCommerce (früher Facebook for WooCommerce, Einstellungen unter Marketing → Facebook) fügt das Meta Pixel automatisch ein. Damit das Pixel nur über das Banner geladen wird, deaktivieren Sie das Pixel der Erweiterung mit dem offiziellen Filter facebook_for_woocommerce_integration_pixel_enabled (in der functions.php des Child-Themes oder als PHP-Snippet in WPCode) und deklarieren Meta Pixel unter Builder → Services.
add_filter( 'facebook_for_woocommerce_integration_pixel_enabled', '__return_false' );Für andere Werbepixel (Google Ads, TikTok, Pinterest…) gilt dasselbe: ID aus den Einstellungen der Erweiterung entfernen und den Dienst unter Builder → Services deklarieren.
Schritt 3: Cache und Minifizierung
WooCommerce verlangt, die Seiten Warenkorb, Kasse und Mein Konto vom Caching auszunehmen, und rät bei manchen Cache-Plugins von JavaScript-Minifizierung ab. Für das Banner nehmen Sie zusätzlich den Consent-Mode-Stub (FlowConsent Loader) und die Domain consent.flowconsent.com von Optionen wie „JavaScript aufschieben“ oder „verzögern“ aus. Leeren Sie danach alle Caches (Plugin, Hoster, CDN).
Schritt 4: Checkout testen
Installation prüfen
- In einem privaten Fenster erscheint das Banner auf der Startseite, einer Produktseite und im Warenkorb.
- Im Tab Netzwerk keine Anfrage an Google, Meta oder andere Dritte vor Akzeptieren.
- Der Installationsassistent (Builder → Integration) prüft die Live-Seite: Loader mit Ihrem Lizenzcode vorhanden, Consent-Mode-Stub vorhanden, Stub vor jedem Google-Tag (Anleitung).
- Ein Ablehnungs-Scan aus dem Tab Compliance bestätigt, dass nach einer Ablehnung nichts feuert (Compliance-Prüfung).
Mit Ihrem KI-Agenten erledigen (MCP)
Der offizielle MCP-Server von FlowConsent, https://mcp.flowconsent.com, funktioniert mit Claude, ChatGPT oder jedem MCP-Client, verbunden per OAuth 2.0 mit Ihrem FlowConsent-Konto (kein API-Schlüssel). Ihr Agent ruft den Code und die Platzierungsanweisungen ab (get_banner_snippet, get_setup_instructions), prüft die Installation mit einem echten Scan (verify_consent_compliance) und kann eine wiederkehrende Überwachung einrichten (monitor_compliance), praktisch, um ein durch ein Erweiterungs-Update reaktiviertes Pixel zu erkennen. Ihren Shop ändert er nicht: Einfügen und Erweiterungseinstellungen bleiben Ihre Aufgabe.
Beispielanfrage: „Gib mir den Code meines Banners für meinen WooCommerce-Shop und prüfe, ob er auf https://meinshop.de korrekt installiert ist.“
Siehe MCP-Server-Anleitung und die Seite FlowConsent MCP.
Häufige Fragen
Verliere ich E-Commerce-Daten, wenn Besucher Cookies ablehnen?
Besucher, die ablehnen, erhalten keine Mess-Cookies. Mit Consent Mode v2 senden Google-Tags dann cookielose Signale, die Google für die Conversion-Modellierung nutzt. Details in der Consent-Mode-Anleitung.
Kann ich FlowConsent über Google Tag Manager laden?
Nein: Über GTM geladen, kommt das Banner für die vorherige Blockierung zu spät. Platzieren Sie den Code im <head> oberhalb des GTM-Containers; Nicht-Google-Tags benötigen die „Zusätzlichen Einwilligungseinstellungen“.
Kann ein Erweiterungs-Update ein Pixel wieder aktivieren?
Ja, das passiert häufig nach einem Versionswechsel oder einer Neukonfiguration. Eine wiederkehrende Überwachung aus dem Tab Compliance oder per monitor_compliance über MCP erkennt es, ohne auf ein manuelles Audit zu warten.
Braucht ein Headless-Shop eine andere Konfiguration?
Ja. Ist Ihre Storefront eine React-, Vue- oder Next.js-App mit clientseitiger Navigation, aktivieren Sie den SPA-Modus in den Banner-Einstellungen (Next.js-Anleitung).