Category: Tutorial

  • WordPress Tutorial: How to Automating Privacy Compliance via the WP Consent API

    WordPress Consent API Audit: FitConsent CMP Passes All Checks

    On WordPress, displaying a visual cookie banner is only half the battle. To be truly compliant, every background plugin that collects user data needs to listen to and respect the visitor\’s choices. Learn how the WP Consent API handles this communication seamlessly.

    Historically, plugins on a single site interpreted consent independently or ignored it altogether. To solve this gap, the WordPress community introduced the WP Consent API—a standardized communication protocol that acts as a universal bridge between your Consent Management Platform (CMP) and your data-collecting plugins.

    When you run an audited solution like FitConsent, user choices are automatically mapped directly to the five standard WordPress consent categories: functional, statistics-anonymous, statistics, preferences, and marketing. Let\’s walk through the full configuration and verification workflow as detailed in our official WP Consent API Compliance Audit.

    Watch the Live Walkthrough Audit

    Step 1: Install and Connect the FitConsent Plugin

    FitConsent includes native, automatic support for the WP Consent API without requiring manual code hooks or extra backend development.

    1. Log in to your WordPress dashboard, navigate to Plugins > Add New Plugin.
    2. Search for FitConsent CMP, click Install Now, and then Activate.
    3. Open your FitConsent platform dashboard, navigate to your website settings, and copy your unique Website ID.
    4. Back in WordPress, go to Settings > FitConsent, paste your Website ID into the designated field, and hit Save Changes.

    Step 2: Align Google Site Kit with the WP Consent API

    Google Site Kit handles Consent Mode in WordPress by linking directly into the WP Consent API layer. When a visitor updates their preferences on the banner, the API passes that data directly down to Site Kit.

    1. In your WordPress sidebar, click on Site Kit > Settings.
    2. Locate the Consent Mode section.
    3. Ensure the toggle is enabled. This ensures Google Analytics and Ads automatically hold back or execute data collection based on the API signals.

    Step 3: Test and Validate Your Compliance Live

    To verify that the integration is working as intended under strict opt-in frameworks like GDPR, you can audit the API via your browser\’s developer console.

    Checking the Initial Denied State:
    Open your website in a fresh incognito window. Before interacting with the cookie banner, right-click anywhere and choose Inspect, then open the Console tab. Run the core checking function:

    wp_has_consent('statistics')

    The console will return false. This confirms that data collection is effectively locked out out-of-the-box. You can also run our built-in diagnostic framework shortcut to see all statuses grouped together:

    window.fitconsent_test_consent()

    This will output a clean report confirming that Statistics, Marketing, and Functional parameters are completely set to denied.

    Checking the Updated Granted State:
    Now, click Accept All on your active visual banner. Run the check again in your console:

    wp_has_consent('statistics')

    The console will immediately shift and return true. FitConsent fires a structural update through the WP Consent API layer the exact millisecond the user interacts with the user interface, immediately releasing Google Site Kit to track the session compliantly.

    A Proven Core for Your Client Projects

    If you are a web designer or developer building technical stacks for clients, ensuring cross-plugin harmony is critical to preventing regulatory infractions. This native handshake eliminates the need for complex, manual tag mapping or custom Javascript event triggers.

    To review the complete technical dataset and logs from our validation test, head over to the official WordPress Consent API Audit Report. Ready to deploy automated compliance on your staging environment? Get started with FitConsent today.

    Soufiane
    Founder, FitConsent

  • Tutorial: Implementing Google Consent Mode V2 via Direct Embed with FitConsent

    Managing Google Consent Mode V2 manually can be highly error-prone. In this tutorial, we will walk through how FitConsent automates the technical handshake—from dashboard configuration to live validation in your browser.

    Google offers two implementation modes for Consent Mode V2: Basic Mode (which blocks tags entirely until consent is given, losing attribution data) and Advanced Mode. Google recommends Advanced Mode because it uses cookieless pings to recover up to 70% of lost attribution data for unconsented users.

    To use Advanced Mode, you must inject consent defaults into the dataLayer before any tag fires and include a registered Google CMP Partner ID. Here is exactly how FitConsent handles this for you.

    Watch the Video Guide

    Step 1: Dashboard Configuration

    Let’s start by configuring the consent banner in your FitConsent dashboard to ensure it outputs the correct Advanced Mode signals.

    1. Add Your Website: In the FitConsent dashboard, click Add Website in the top right and enter your domain. Once created, click Configure Website.
    2. General Settings: Enter your GA4 Measurement ID to link FitConsent to your Google Analytics property. Set the Legislative Framework to Auto so FitConsent can dynamically apply the correct legal framework based on the visitor’s location.
    3. Enable Advanced Mode: This is the most critical step. Toggle Google Consent Mode V2 to Advanced. This instructs FitConsent to inject our Google Partner ID into every consent call, certifying your site as CMP-compliant.
    4. Customize Appearance & Behavior: Navigate through the Appearance, Content, and Behavior tabs to adjust colors, text, translations, and button layouts (like enabling/disabling the Decline button based on your region’s requirements).

    Step 2: Integrating the Direct Embed Code

    With the dashboard configured, it is time to add the code to your website. Navigate to the Integration tab and select Code and Integration > Direct Embed.

    The code provided here must be pasted into the <head> section of every page, before any other scripts (like Google Analytics or Google Ads).

    How the code works: The first block immediately sets all four Consent Mode signals (ad_storage, ad_user_data, ad_personalization, and analytics_storage) to denied. It also passes developer_id: true, which registers FitConsent as the active CMP before any user interaction occurs.

    Below the default script, you will load your tracking tags, followed by the asynchronous FitConsent banner script which handles the user’s choice and fires the update calls.

    Step 3: Live Validation in the Browser

    You can verify that FitConsent is working perfectly using your browser’s developer tools.

    1. Open your website and right-click to Inspect the page. Navigate to the Console tab.
    2. Type dataLayer.filter(e => e[0] === 'consent') and press Enter. This isolates the consent-related events.
    3. Inspect the Default Call: Expand the first entry (Index 0). You will see the arguments consent and default, with all four signals set to denied and the developer_id present. Notice the gtm.uniqueEventId is 1—confirming it fired first.
    4. Interact with the Banner: Click Accept All on your live banner.
    5. Inspect the Update Call: Run the filter command again and expand the newest entry. You will now see the arguments consent and update, with all four signals marked as granted.

    Step 4: Cross-Checking with Google Tag Assistant

    For ultimate peace of mind, you can validate the integration using Google Tag Assistant.

    • Connect Tag Assistant to your website URL.
    • Looking at the event timeline on the left, you will verify that Consent Default is Event 1.
    • Navigate to the Consent tab to view the Event Consent State table.
    • Before clicking the banner, the On-page Default, On-page Update, and Current State columns will all show Denied for the four purposes.
    • After clicking Accept All, the timeline will show a new Consent Update. The On-page Update and Current State columns will immediately switch to Granted for ad_storage, analytics_storage, ad_user_data, and ad_personalization.

    And that’s it! Your defaults are set, your updates fire correctly, and Google’s Tag Assistant confirms you are fully compliant.

    Note: If you use a tag-managed environment instead of a direct embed, you can achieve the exact same behavior using the official FitConsent GTM Community Template available in the dashboard.