Integrations

Choose how to add CookieFrame to your website. We offer multiple integration options to fit your setup.

Google Tag Manager (Recommended)

For websites already using Google Tag Manager, this is the recommended integration method. It includes built-in Google Consent Mode v2 support.

View full GTM integration guide →

Manual Installation

For developers who want full control or don't use GTM. Add a single script tag to your HTML and optionally interact with consent via JavaScript.

Quick start:

<script src="https://cookieframe.com/api/widget/YOUR_DOMAIN_ID/script.js" async></script>

View full manual installation guide →

The manual installation guide covers:

Script placement and loading options
Complete JavaScript API reference
Event handling for consent changes
Conditional script loading patterns
Google Consent Mode v2 integration
Single-page application (SPA) support
Server-side rendering (SSR) frameworks
Troubleshooting

WordPress Plugin

Download and install our WordPress plugin for automatic integration.

Installation Steps

Download

Download Plugin (.zip)

Steps

Log in to your WordPress admin dashboard
Go to Plugins → Add New → Upload Plugin
Click Choose File and select the downloaded .zip file
Click Install Now, then Activate Plugin
Go to Settings → CookieFrame in your WordPress admin
Enter your Domain ID (find it in your CookieFrame Dashboard under Settings → Integration)
Click Save

The plugin automatically adds the consent banner to your site. If you're using a caching plugin, you may need to clear your cache after activation.

GDPR and other privacy regulations require you to allow users to change their cookie preferences at any time. Add a "Cookie Preferences" link to your footer or privacy page.

Implementation Options

Option 1: Data Attribute (Recommended)

Add the data-cookieframe="preferences" attribute to any element:

<a href="#" data-cookieframe="preferences">Cookie Preferences</a>

Option 2: JavaScript API

<a href="#" onclick="window.CookieFrame && window.CookieFrame.showPreferences(); return false;">
  Cookie Preferences
</a>

Option 3: Queue-Based (Race Condition Safe)

<a href="#" id="cookie-prefs">Cookie Preferences</a>
<script>
document.getElementById('cookie-prefs').addEventListener('click', function(e) {
  e.preventDefault();
  if (window.CookieFrame) {
    window.CookieFrame.showPreferences();
  } else {
    window.CookieFrameQueue = window.CookieFrameQueue || [];
    window.CookieFrameQueue.push(function(w) { w.showPreferences(); });
  }
});
</script>

The CookieFrame widget must be installed on the same page. The preferences link only works on pages where the script is loaded.

For more details on the JavaScript API, see the manual installation guide.

Need Help?

If you're having trouble with installation, email us at support@cookieframe.com.

Integrations

On this page