Легкий плагин jQuery, который отображает cookie 🍪 сообщение о согласии в соответствии с требованиями государства. Плагин отображает сообщение при первом посещении пользователем вашего веб-сайта и, по умолчанию, снова через 30 дней с момента его последнего посещения.
Посетитель должен кликнуть кнопку «Принять» во всплывающем окне, чтобы установить файл cookie, и тем самым предоставить свое согласие.
Загрузите последнюю версию и включите ее на своей странице вместе с jQuery (1.7.4 или более новый).
<script type="text/javascript" src="//ajax.googleapis.com/ajax/libs/jquery/2.x.x/jquery.min.js"></script>
<script type="text/javascript" src="jquery.ihavecookies.min.js"></script>Затем инициализируйте плагин, используя:
// С настройками по-умолчанию
$('body').ihavecookies();
// Или изменив настройки
var options = {
title: ...
}
$('body').ihavecookies(options);Это добавит всплывающее окно cookie к тегу <body> с настройками по-умолчанию и стандартным сообщением.
Есть несколько вариантов, доступных для настройки:
| Опция | Значение по-умолчанию | Описание |
|---|---|---|
| title | "Файлы cookie и конфиденциальность" | Пользовательский заголовок для всплывающего окна |
| message | "Файлы cookie позволяют вам использовать корзину для покупок и персонализировать ваш выбор на наших сайтах, сообщают нам, какие части наших веб-сайтов посещали люди, помогают нам измерять эффективность рекламы и поисковых запросов в Интернете, а также дают нам представление о поведении пользователей, чтобы мы могли улучшить свои сервисы." | Cобственное сообщение cookie, если вы предпочитаете не использовать по-умолчанию. HTML-код может быть включен в это сообщение. |
| link | "/privacy-policy" | Ссылка на вашу политику конфиденциальности для получения дополнительной информации |
| delay | 2000 | Время до появления всплывающего окна после загрузки страницы (в миллисекундах) |
| expires | 30 | Дни истечения срока действия cookie |
| onAccept | function(){} | Дополнительная callback-функция при нажатии кнопки «Принять» |
| uncheckBoxes | false | Снимает все флажки при загрузке страницы, к которым применяются классы .ihavecookies. Установите в true, чтобы включить эту опцию |
| moreInfoLabel | 'Подробнее' | Надпись ссылки на политику конфиденциальности |
| acceptBtnLabel | 'Согласен' | Надпись кнопки согласия |
| advancedBtnLabel | 'Настроить' | Надпись кнопки настройки пользовательских cookie |
| cookieTypesTitle | 'Выберите cookie файлы, которые принимаете' | Название для раздела пользовательских файлов cookie |
| fixedCookieTypeLabel | 'Основные' | Заголовок "основных" cookie файлов |
| fixedCookieTypeDesc | 'Файлы cookie, которые необходимы для коррекной работы сайта.' | Описание для "основных" cookie файлов. |
| cookieTypes | Массив [] | Массив типов файлов cookie, для которых должны отображаться флажки - см. Пример кода ниже. |
Используя reinit открыть ihavecookies при нажатии на элемент. Откроется сообщение с отмеченными ранее флажками.
$('button').click(function(){
$('body').ihavecookies(options, 'reinit');
});Приведенный ниже код показывает пример параметров типов файлов cookie.
$('body').ihavecookies({
// Дополнительный callback при нажатии кнопки «Принять»
onAccept: function() {
// Делайте все, что вам нужно здесь ...
},
// Массив типов файлов cookie, для которых отображаются флажки.
// - type: Тип cookie. Это также метка, которая отображается.
// - value: Значение флажка, чтобы его можно было легко определить в
// вашем приложении.
// - description: Описание для этого типа файлов cookie. Отображается в
// title аттрибута.
cookieTypes: [
{
type: 'Настройки сайта',
value: 'preferences',
description: 'Данные файлы cookie, связаны с настройками сайта, например, запоминание имени пользователя, темы сайта и т. д.'
},
{
type: 'Analytics',
value: 'analytics',
description: 'Файлы cookie, связанные с посещениями сайта, типами браузеров и т. д.'
},
{
type: 'Marketing',
value: 'marketing',
description: 'Файлы cookie, связанные с маркетингом, например информационные письма, социальные сети и т. д.'
}
],
});$.fn.ihavecookies.cookie() возращает значение cookieControlPrefs cookie.
$.fn.ihavecookies.preference(cookieTypeValue) возвращает true если тип cookie принят, иначе false.
Плагин не содержит CSS, поэтому его можно стилизовать на ваше усмотрение. Сообщение cookie имеет идентификатор #gdpr-cookie-message. Образец CSS можно посмотреть в example.css файле.
Когда посетитель принимает сообщение, cookie cookieControl со значение true устанавливаются вместе с cookie cookieControlPrefs который содержит массив принятых типов файлов cookie, например, ["preferences","analytics"]. Это позволит вам выполнить дополнительные проверки, где это необходимо на вашем сайте.
Пример сообщения о согласии на использование файлов cookie можно посмотреть по адресу https://iamketan.com.au или в прилагаемом example.html файле.
Этот плагин доступен под лицензией MIT.