Создание cookie-предупреждения для сайта

Тут нам поможет библиотека js-cookie.

По традиции, пишем HTML

HTML

<div class="cookie-block">
  Пока куки есть - меня не будет видно.

  <button class="ok">ok</button>
</div>
<script src="cookie.min.js"></script>
<script src="script.js"></script>

Ну как видите сам див говорит за себя)

CSS

.cookie-block {
  width: 300px;
  height: 50px;
  border: 3px solid red;
  display: none;
}

Скрываем предупреждение по умолчанию

JS

const cookieEl = document.querySelector('.cookie-block');
const okEl = document.querySelector('.ok');

okEl.addEventListener('click', () => {
  cookieEl.style.display = 'none';
});

let cookies = () => {
  if (!Cookies.get('hide-cookie')) {
    setTimeout(() => {
      cookieEl.style.display = 'block';
    }, 1000);
  }

  Cookies.set('hide-cookie', 'true', {
    expires: 30
  });
}


cookies();

Ну и относительно несложный JS:

1. Находим блок с куки и кнопку ок
2. По клику на кнопку ок скрываем предупреждение
3. Пишем функцию cookies, которая смотрит, если кука hide-cookie не существует — показываем блок
4. Ну и устанавливаем саму куку на 30 дней через параметр expires

В общем-то и все, очень простой код. Надеюсь, поможет вам. Исходники внизу, а видео — в начале поста)

Удачи!