Dokumentation

Alles, was Sie brauchen, um Barefoot CMP einzurichten, zu konfigurieren und zu optimieren. Von der ersten Integration bis zur detaillierten API-Referenz.

▶

Erste Schritte

Getting Started Start

In 5 Minuten zum DSGVO-konformen Cookie-Banner. Account erstellen, Script einbinden, fertig.

Schnellstart (3 Schritte)

Die absolute Kurzversion: Account, Script, Live. Für Eilige.

🔌

Integration

HTML / JavaScript

Direkte Code-Integration mit Script-Tag und Query-Parametern.

WordPress

Plugin, Theme Header oder Code-Injection. WooCommerce, Elementor, Divi kompatibel.

Shopify

theme.liquid Integration, Tracking-Pixel, Shopify Markets und Checkout.

Webflow, Wix & Co

Webflow, Squarespace, Wix, Shopware, Typo3 und weitere Plattformen.

Google Tag Manager

Custom HTML Tag, Custom Template, Consent Mode Trigger und DataLayer.

⚙

Features & Konfiguration

Banner-Design

Themes, Farben, Positionen, Multi-Sprach-Support, eigene Texte und Accessibility.

Cookie-Scanner

Automatische Cookie-Erkennung, 30+ Tracker-Patterns, Kategorisierung.

Geo-Targeting

EU/Non-EU Erkennung, länderspezifische Regeln, Fallback-Verhalten.

JavaScript API

Öffentliche API-Methoden, Konfiguration, Events, Script-Blocking und Beispiele.

Consent-Statistiken

Accept/Reject-Raten, Kategorie-Akzeptanz, CSV-Export für DSGVO-Audits.

Policy-Generator

Automatische Cookie-Richtlinie für Ihre Datenschutzseite. Embed, API oder HTML.

🛠

Technische Referenz

API-Referenz

Alle REST API Endpoints mit Request/Response-Beispielen. Auth, CRUD, Export.

Google Consent Mode v2

Alle 7 Signale, technische Implementierung, GTM, GA4 und Google Ads.

Performance

Script-Größe, Lighthouse-Scores, CDN-Caching und Optimierungs-Tipps.

⚖

Rechtliches & Migration

DSGVO-Leitfaden

Alles zur DSGVO: Pflichten, Kategorien, Bußgelder, Checkliste und häufige Fehler.

Migration

Wechsel von Cookiebot, CookieYes, Usercentrics oder anderen CMPs.

Roadmap

Aktuelle Features, geplante Funktionen und Changelog.

Schnellstart

Barefoot CMP in 3 einfachen Schritten einrichten. Keine technischen Kenntnisse erforderlich.

Hinweis: Du benötigst ein aktives Barefoot CMP-Konto. Registriere dich kostenlos, falls du noch kein Konto hast.

Schritt 1: Account erstellen

Melde dich im Dashboard an oder erstelle ein neues Konto. Nach der Registrierung erhältst du automatisch deine eindeutige CMP-ID.

Schritt 2: Website registrieren

Im Dashboard:

Klicke auf „Neue Website"
Gib die Domain deiner Website ein (z.B. www.beispiel.de)
Wähle die gewünschten Sprachen
Speichern – du erhältst eine Website-spezifische CMP-ID

Schritt 3: Script einbinden

Kopiere diese Zeile Code und füge sie in den <head> deiner Website ein:

          HTML
          <script src="https://cmp.barefoot-performance.com/v1/loader.js?id=DEINE_CMP_ID" async></script>
        

Fertig! Das Banner sollte jetzt auf deiner Website sichtbar sein. Für eine ausführlichere Anleitung siehe Getting Started.

HTML/JavaScript Integration

Detaillierte Anleitung für die direkte Code-Integration in deine Website.

Basis-Integration

Die einfachste Methode: Eine einzige Script-Zeile im HTML-Head:

          HTML
          <!-- Barefoot CMP Loader -->
<script src="https://cmp.barefoot-performance.com/v1/loader.js?id=YOUR_CMP_ID" async></script>
        

Platzierung im HTML

Platziere das Script im <head>-Bereich, vor allen anderen Scripts:

          HTML
          <!DOCTYPE html>
<html>
<head>
  <meta charset="UTF-8">
  <title>Meine Website</title>

  <!-- Barefoot CMP – IMMER ZUERST -->
  <script src="https://cmp.barefoot-performance.com/v1/loader.js?id=YOUR_CMP_ID" async></script>

  <!-- Andere Scripts danach -->
  <script src="analytics.js"></script>
</head>
<body>
  <!-- Dein Inhalt -->
</body>
</html>
        

Query-Parameter

Du kannst das Loader-Script mit zusätzlichen Parametern konfigurieren:

Parameter	Wert	Beschreibung
`id`	`string` (erforderlich)	Deine CMP-ID aus dem Dashboard
`lang`	`de` \| `en` \| ...	Banner-Sprache (12 Sprachen verfügbar)
`position`	`bottom` \| `top` \| `center`	Banner-Position (Standard: bottom)
`theme`	`light` \| `dark` \| `auto`	Design-Theme (Standard: light)

Beispiel mit Parametern:

          HTML
          <script src="https://cmp.barefoot-performance.com/v1/loader.js?id=YOUR_CMP_ID&lang=de&position=top&theme=dark" async></script>
        

Für die vollständige JavaScript API, Konfigurationsoptionen und Events siehe JavaScript API & Events.

Weitere Plattformen

Webflow, Squarespace, Wix und andere Platform-as-a-Service Lösungen.

Webflow

Gehe zu Project Settings → Custom Code
Öffne den Tab Head Code
Füge das Script ein und speichere

          HTML
          <script src="https://cmp.barefoot-performance.com/v1/loader.js?id=YOUR_CMP_ID" async></script>
        

Squarespace

Klicke auf Settings → Advanced → Code Injection
Im Feld Header das Script einfügen
Speichern

Wix

Gehe zu Settings → Advanced → Custom Code
Klicke auf Add Custom Code
Script einfügen, Ort auf Head setzen
Speichern und publizieren

Shopware, Typo3, andere CMS

Für alle anderen Systeme gilt: Füge das Script im <head>-Bereich ein, idealerweise vor anderen Scripts. Detaillierte Anleitungen für WordPress und Shopify finden Sie auf den jeweiligen Seiten.

Fehlerbehebung

Lösungen für häufige Probleme und Fehler.

Banner wird nicht angezeigt

Überprüfe Folgendes:
1. Ist das Script wirklich im <head> eingefügt?
2. Hast du YOUR_CMP_ID durch deine echte ID ersetzt?
3. Browser-Cache leeren (Strg+Shift+Del)
4. Browser-Konsole prüfen (F12 → Console) auf JavaScript-Fehler
5. CMP-ID im Dashboard aktiviert?

Wahrscheinliche Ursachen:
- JavaScript-Bibliotheks-Konflikt (jQuery, andere CMP)
- CSS-Konflikte mit deinem Theme
- Content-Security-Policy blockiert das Script

Lösung: Browser-Konsole auf Fehler prüfen. Temporär andere Scripts deaktivieren. CSP-Header prüfen.

Google Consent Mode

Überprüfe:
1. Barefoot CMP Script muss VOR GA4/Ads-Tag geladen werden
2. Google Tag Manager sollte nach Barefoot CMP laden
3. Consent Mode v2 in GA4/Google Ads Admin aktiviert
4. Google Tag Assistant zur Prüfung nutzen

Detaillierte Anleitung: Google Consent Mode v2 Guide

Performance-Probleme

Performance-Tipps:
1. async Attribut im Script verwenden (Standard)
2. Preconnect-Hint hinzufügen
3. Andere Scripts/Plugins prüfen
4. Barefoot CMP ist nur ~25KB gzipped

Detaillierte Analyse: Performance-Leitfaden

Support kontaktieren

Wenn dein Problem nicht gelöst ist:

Email: contact-us@barefoot-performance.com
Dashboard: Support-Ticket im Support-Bereich
Angaben: CMP-ID, Website-URL, Fehlerbeschreibung, Screenshot