Cookie Consent Banner

This application includes a simple cookie consent banner component that lets you add Google Analytics and other tracking scripts to your application.

By default, the cookie banner is added to the guest layout. To add it to other layouts or pages, include it like this:

<x-blocks.cookie-banner />

Google Analytics Support

The component has built-in support for Google Analytics 4 (GA4). It validates the GA ID format and only loads the Google Tag Manager script after the user gives consent.

How to Add Your Google Analytics Tag

Set the GOOGLE_ANALYTICS_ID environment variable in your .env file:

GOOGLE_ANALYTICS_ID=G-XXXXXXXXXX

How to Add More Tracking Scripts

To add additional tracking scripts, modify the loadMoreScripts() method in the component. This method runs automatically after the user accepts cookies.

Step 1: Locate the Component

The cookie banner component is located at:

resources/views/components/blocks/cookie-banner.blade.php

Step 2: Add Your Scripts

Find the loadMoreScripts() method and add your tracking scripts. Here's an example:

Example: Adding Facebook Pixel

loadMoreScripts() {
    // Facebook Pixel
    if (document.getElementById('fb-pixel')) return;
    
    !function(f,b,e,v,n,t,s)
    {if(f.fbq)return;n=f.fbq=function(){n.callMethod?
    n.callMethod.apply(n,arguments):n.queue.push(arguments)};
    if(!f._fbq)f._fbq=n;n.push=n;n.loaded=!0;n.version='2.0';
    n.queue=[];t=b.createElement(e);t.async=!0;
    t.src=v;s=b.getElementsByTagName(e)[0];
    s.parentNode.insertBefore(t,s)}(window, document,'script',
    'https://connect.facebook.net/en_US/fbevents.js');
    
    const fbPixel = document.createElement('script');
    fbPixel.id = 'fb-pixel';
    fbPixel.innerHTML = 'fbq("init", "YOUR_PIXEL_ID"); fbq("track", "PageView");';
    document.head.appendChild(fbPixel);
}

Step 3: Call the Method

Make sure the enableScripts() method calls loadMoreScripts():

enableScripts() {
    this.loadAnalytics();
    this.loadMoreScripts();
}

References

Category	Path / Name	Description
Component	resources/views/components/blocks/cookie-banner.blade.php	Cookie consent banner component
Layout	resources/views/components/layouts/guest.blade.php	Guest layout where the component is included by default