Laravel 11 - Statikbe Cookie Consent For EU

Touseef Afridi
02 Oct 24

Laravel 11 - Statikbe Cookie Consent For EU

In this tutorial, we will explore how to implement Statikbe Cookie Consent for the EU in Laravel 11, ensuring compliance and enhancing user trust.


If you're a video person, feel free to skip the post and check out the video instead!


Step # 1 : Create fresh Laravel project or use existing project.

Two commands to create fresh laravel project
Global Command : laravel new cookie
Or use
Non Global Command : composer create-project laravel/laravel --prefer-dist cookie

Step # 2 : Access the project.

Open a terminal (e.g., Git Bash) and navigate to your Laravel project's root folder.
Git Bash : cd c:xampp/htdocs/cookie

Step # 3 : Install the package.

Command : composer require statikbe/laravel-cookie-consent
The package will automatically register itself.

Step # 4 : Publish javascript and css files.

Command : php artisan vendor:publish --provider="Statikbe\CookieConsent\CookieConsentServiceProvider" --tag="cookie-public"

Step # 5 : Create Master view.

In this tutorial, I will be using a sample master Blade template that includes the basic HTML structure provided below.
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Code Shotcut - Cookie Consent Modal for EU</title>
    <link href="https://cdn.jsdelivr.net/npm/tailwindcss@2.2.19/dist/tailwind.min.css" rel="stylesheet">
</head>
<body class="bg-gray-800">
    <div class="container mx-auto mt-10">
        <div class="text-center">
            <h1 class="text-4xl font-bold text-white mb-4">Welcome to Code Shotcut!</h1>
            <p class="text-lg text-gray-400 mb-8">This is a sample website demonstrating cookie consent.</p>
            <p class="text-md text-gray-300 mb-4">
                You can include the cookie consent functionality by adding the middleware to your web routes and publishing the package assets.
                Ensure to follow the instructions in the <strong>Laravel Cookie Consent</strong> documentation for proper integration.
            </p>
            <p class="text-md text-gray-300 mb-4">
                It is recommended to include the necessary CSS and JS files in your master or base layout Blade file.
                This ensures that the cookie consent modal is available on all pages of your application.
            </p>
            <p class="text-md text-gray-300">
                For more details, check the <a href="https://github.com/statikbe/laravel-cookie-consent" class="text-blue-400 underline" target="_blank">official documentation</a>.
            </p>
        </div>
    </div>
</body>
</html>

Step # 6 : Update route.

Let's ensures that when users visit the homepage, the master view is displayed.
Route::get('/', function () {
    return view('master');
});

Step # 7 : Include cookie-consent.css in Master view.

<link rel="stylesheet" type="text/css" href='{{asset("vendor/cookie-consent/css/cookie-consent.css")}}'>
Usage :
Ensure the CookieConsentMiddleware is being registered globally in your AppServiceProvider.
Open app/Providers/AppServiceProvider.php. Add the CookieConsentMiddleware in the boot() method to the web middleware group.
Here’s how your AppServiceProvider.php should look:
<?php
namespace App\Providers;
use Illuminate\Support\ServiceProvider;
use Statikbe\CookieConsent\CookieConsentMiddleware;
class AppServiceProvider extends ServiceProvider
{
    /**
     * Register any application services.
     */
    public function register(): void
    {
        //
    }
    /**
     * Bootstrap any application services.
     */
    public function boot(): void
    {
        // Add middleware to the 'web' group
        app('router')->pushMiddlewareToGroup('web', CookieConsentMiddleware::class);
    }
}

Step # 8 : It's time to test.

Start the Laravel development server.
Command : php artisan serve.
Access below URL
127.0.0.1:8000

Step # 9 : Customization.

Customization of Cookie Consent Messages:
In order to Customize the dialog contents run the following command.
Command : php artisan vendor:publish --provider="Statikbe\CookieConsent\CookieConsentServiceProvider" --tag="cookie-lang"
This command will create a new directory under lang/vendor/cookie-consent, which contains localization files for different languages.

To change the default messages, navigate to the en folder and open the corresponding language file. Here’s an example of how to update the consent message:
Let's update the alert accept text
From
'alert_accept' => 'Accept all cookies',
To
'alert_accept' => 'Custom Message - Accept all cookies',

This allows you to tailor the consent alert to your application's needs.

Configuration of Cookie Consent:
Command : php artisan vendor:publish --provider="Statikbe\CookieConsent\CookieConsentServiceProvider" --tag="cookie-config"
This will publish the configuration file (App/config/cookie-consent.php) that contains settings for cookie consent management.
<?php
return [
    'cookie_key' => '__cookie_consent',
    'cookie_value_analytics' => '2',
    'cookie_value_marketing' => '3',
    'cookie_value_both' => 'true',
    'cookie_value_none' => 'false',
    'cookie_expiration_days' => '365',
    'gtm_event' => 'cookie_refresh',
    'ignored_paths' => [],
    'policy_url_en' => env('COOKIE_POLICY_URL_EN', null),
    'policy_url_fr' => env('COOKIE_POLICY_URL_FR', null),
    'policy_url_nl' => env('COOKIE_POLICY_URL_NL', null),
];

Share this with friends!


"Give this post some love and slap that 💖 button as if it owes you money! 💸😄"
0

0 Comments

To engage in commentary, kindly proceed by logging in or registering