weble/laravel-cookiebar

Laravel Cookies Consent Management for the new EU Cookie LAW

3.2.0 2024-06-04 14:45 UTC

This package is auto-updated.

Last update: 2024-09-04 15:20:14 UTC


README

Laravel package for the new EU Cookie LAW. Provides a nice toolbar with a modal to select which consent

安装

composer require weble/laravel-cookiebar

发布资产

将运行 laravel-cookiebar 所需的资产复制到您的项目中。这包括javascript文件、语言文件和视图。

发布全部

 php artisan vendor:publish --provider="Weble\Cookiebar\CookiebarServiceProvider"

仅发布视图

 php artisan vendor:publish --tag=cookiebar-views

仅发布资产

 php artisan vendor:publish --tag=cookiebar-assets

仅发布翻译

 php artisan vendor:publish --tag=cookiebar-translations

配置 - 可选

您还可以选择发布配置文件。

php artisan vendor:publish --provider="Weble\Cookiebar\CookiebarServiceProvider" --tag="cookiebar-config"

此外,请记住遵循 Spatie GoogleTagManager 的安装说明,该说明包含在此包中,并且对于正确使用 cookeibar 是必需的。

用法

一旦正确设置了 Spatie GoogleTagManager,请确保在 cookiebar 配置文件中设置选项以适应您的需求。

最重要的是,请记住启用 cookiebar 并设置您需要的同意。

根据您的需求在布局中包含 cookiebar::index,通常在关闭 body 标签之前;

googletagmanager::head 之前包含 cookiebar::default-consents

重新打开同意模态框。

您可以通过调用

window.gtmCookieBar.editConsents()

通常这会在您网站的页脚中的链接/按钮中完成。

自定义

默认情况下,cookiebar 使用 Tailwind CSS 进行样式设置。

将此配置添加到您的 tailwind.config.js 文件中以设置颜色

cookiebar: {
   banner: {
       'primary': '', // bg - button
       'secondary': '', // text - buttont
   },
   modal: {
       'drop': '', 
       'primary': '', // title
       'secondary': '', // text
   checkbox: {
       'primary': '', // checked - border color
       'secondary': '', // unchecked color
   },
   button: {
       save: {
           'primary': '', // button bg color
           'secondary': '', // button text color
           'hover': '', // button hover color
       },
   cancel: {
       'secondary': '', // button text color
       }
   }
},

将此配置添加到您的 tailwind.config.js 文件中以设置复选框图标

...

backgroundImage: theme => ({
    ...
    'cookiebar-modal-checkbox-icon': 'url("data:image/svg+xml,%3csvg xmlns=\'http://www.w3.org/2000/svg\' viewBox=\'0 0 20 20\'%3e%3cpath fill=\'none\' stroke=\'%23fff\' stroke-linecap=\'round\' stroke-linejoin=\'round\' stroke-width=\'3\' d=\'M6 10l3 3l6-6\'/%3e%3c/svg%3e")'
    ...
}),
    ...

您可以将视图、资产和翻译发布,然后编辑 resources/view/vendor/cookiebar/ 中的文件以更好地满足您的需求。