Всплывашка куков
  • Полностью бесплатно

  • Не влияет на работу каких-либо скриптов!
Для любого сайта
и менеджера тегов
Не навязчиво
Короткий локальный код
Минималистичный универсальный дизайн
Текст + Кнопка
Это просто уведомление, которое не влияет на что-либо. Если вам нужно, что бы выбор влиял на скрипты или были настройки, такая функция есть например в тег менеджере Matomo.
Как выглядит визуально
Для наглядного примера эта всплывашка установлена на этой странице.
Лаконичный дизайн
Текст, ссылка на документы, кнопка.

Цвет можно адаптировать под дизайн локального сайта.
Простой код
1 часть - локальный код
2 часть - общий код на хостинге
Сохраняет куки
Нажатие на кнопку ОК - хранится 365 дней макимум
Как поставить на Tilda:
Скопируйте весь код и добавьте
1 вариант - на весь сайт. В настройках сайта, в разделе "Ещё", есть пункт "Html-код для вставки внутрь HEAD"
2 вариант - если у вас выбрана какая-то страница как Header или Footer. Добавьте блок: "T123 - HTML блок". И добавьте весь код туда.

3 вариант - если хотите поставить только на конкретной странице. То на нужной странице - добавьте блок: "T123 - HTML блок". И добавьте весь код туда.
4 вариант - если вам нужно на разных страницах, разный текст сообщений. Тогда на Header или Footer, вы ставите только основной код (библиотеку), а локальный код устанавливайте на каждой странице отдельно, меня текст на каждой странице.
5 вариант - Можно поставить через тег менеджер который вы используйте (Яндекс, Google, Matomo).

Так же проверьте галочку в настройках сайта, в разделе ещё:
  • Подключить jQuery на страницах сайта
Обновите контент
Текст, и ссылки под свою ситуацию.
Адаптируйте дизайн
  • Адаптируйте положение виджета под дизайн вашего сайта.
  • Можете поменять цвета ссылок и кнопоки.
Протестируйте самостоятельно
Если всё работает - Вы молодец
Как поставить на свой сайт:
Скопируйте весь код и добавьте
1 вариант - Основную библиотеку разместите на хостинге отдельным файлом. Добавьте локальный код в Header или Footer. Отредактируйте пусть к файлу библиотеки.
2 вариант - Добавьте код целиком в Header или Footer.
3 вариант - Можно поставить через тег менеджер который вы используйте (Яндекс, Google, Matomo).
Обновите контент
Текст, и ссылки под свою ситуацию.
Адаптируйте дизайн
  • Адаптируйте положение виджета под дизайн вашего сайта.
  • Можете поменять цвета ссылок и кнопоки.
Протестируйте самостоятельно
Если всё работает - Вы молодец
Основной код, для сайта
Локальный код, ставится на каждый отдельный сайт. Поэтому в нём можно поменять цвета под дизайн.
<!-- 1. УВЕДОМЛЕНИЕ О КУКАХ  -->
<div id="cookie_alert" class="cookie_alert" data-back="FFFFFF" data-txtcolor="000000" data-btncolor="3a424e" data-btntxtcolor="FFFFFF" data-shadow="1" style="display:none;">
  <div id="cookie_alert__text">Пользуясь нашим сайтом, вы соглашаетесь с тем, что <a href="/privacy" target="_blank">мы используем cookies</a></div>
  <button type="button" id="cookie_alert__ok">OK</button>
</div>

<link  href='https://Домен/css/cookies_styles.min.css' rel='stylesheet' type='text/css' /> 
<script src="https://Домен/js/cookies_script.min.js" async></script>
<!-- УВЕДОМЛЕНИЕ О КУКАХ - КОНЕЦ -->
Код файлов cookies_script.min.js и cookies_styles.min.css
Разместите их у себя на хостинге, там где вам удобно.
Скачать файлы:
https://aaateh.webking.pro/cdn/pop-up-cookies/cookies_styles.min.css
https://aaateh.webking.pro/cdn/pop-up-cookies/cookies_script.min.js

<!-- Контент фалйа: cookies_styles.min.css :-->
#cookie_alert{display:flex!important;align-items:center;height:70px;padding:0 145px 0 25px;position:fixed;left:30px;bottom:30px;margin-bottom:-1000px;width:750px;border-radius:4px;box-sizing:border-box;background:#fff;transition:.6s;z-index:9999999999}#cookie_alert.ca_shadow{box-shadow:0 0 20px 1px rgba(0,0,0,.1)}#cookie_alert__text{margin:0;padding:0;font-size:14px;line-height:130%;text-transform:none;letter-spacing:0;color:#000}#cookie_alert__text a{color:#f01a24;text-decoration:underline}#cookie_alert__text a:hover{text-decoration:none}#cookie_alert__ok,#cookie_alert__ok:focus{position:absolute;right:30px;top:50%;margin:-20px 0 0!important;box-sizing:border-box;height:40px;width:100px;padding:0!important;border-radius:4px;line-height:100%;letter-spacing:0;font-size:16px;color:#fff;background:#f01a24;border:0;box-shadow:none;outline:0;transition:.2s}#cookie_alert__ok:hover{transform:scale(1.1);cursor:pointer}@media screen and (max-width:1100px){#cookie_alert__ok:hover{transform:none}}@media screen and (max-width:1000px){#cookie_alert{width:auto;right:30px}}@media screen and (max-width:750px){#cookie_alert{display:block!important;height:auto;padding:16px;left:20px;right:20px;bottom:20px;margin-bottom:-1000px;border-radius:4px}#cookie_alert__text{width:100%;padding:0 0 16px;font-size:12px}#cookie_alert__ok,#cookie_alert__ok:focus{width:100%;height:30px;position:relative;top:auto;right:auto;margin:0!important}}

<!-- Контент фалйа: cookies_script.min.js  :-->
!function(e){var o;if("function"==typeof define&&define.amd&&(define(e),o=!0),"object"==typeof exports&&(module.exports=e(),o=!0),!o){var t=window.Cookies,n=window.Cookies=e();n.noConflict=function(){return window.Cookies=t,n}}}(function(){function a(){for(var e=0,o={};e<arguments.length;e++){var t=arguments[e];for(var n in t)o[n]=t[n]}return o}function d(e){return e.replace(/(%[0-9A-Z]{2})+/g,decodeURIComponent)}return function e(s){function c(){}function t(e,o,t){if("undefined"!=typeof document){"number"==typeof(t=a({path:"/"},c.defaults,t)).expires&&(t.expires=new Date(1*new Date+864e5*t.expires)),t.expires=t.expires?t.expires.toUTCString():"";try{var n=JSON.stringify(o);/^[\{\[]/.test(n)&&(o=n)}catch(e){}o=s.write?s.write(o,e):encodeURIComponent(String(o)).replace(/%(23|24|26|2B|3A|3C|3E|3D|2F|3F|40|5B|5D|5E|60|7B|7D|7C)/g,decodeURIComponent),e=encodeURIComponent(String(e)).replace(/%(23|24|26|2B|5E|60|7C)/g,decodeURIComponent).replace(/[\(\)]/g,escape);var r="";for(var i in t)t[i]&&(r+="; "+i,!0!==t[i]&&(r+="="+t[i].split(";")[0]));return document.cookie=e+"="+o+r}}function o(e,o){if("undefined"!=typeof document){for(var t={},n=document.cookie?document.cookie.split("; "):[],r=0;r<n.length;r++){var i=n[r].split("="),c=i.slice(1).join("=");o||'"'!==c.charAt(0)||(c=c.slice(1,-1));try{var a=d(i[0]);if(c=(s.read||s)(c,a)||d(c),o)try{c=JSON.parse(c)}catch(e){}if(t[a]=c,e===a)break}catch(e){}}return e?t[e]:t}}return c.set=t,c.get=function(e){return o(e,!1)},c.getJSON=function(e){return o(e,!0)},c.remove=function(e,o){t(e,"",a(o,{expires:-1}))},c.defaults={},c.withConverter=e,c}(function(){})}),jQuery(function(r){var i=r("#cookie_alert"),c=Cookies.get("cookie_ok"),e=0;if("1"==c)console.log("cookies accepted");else{function o(){var e=i.data("back"),o=i.data("txtcolor"),t=i.data("btncolor"),n=i.data("btntxtcolor");1==i.data("shadow")&&i.addClass("ca_shadow"),i.css({background:"#"+e}),r("#cookie_alert__text").css({color:"#"+o}),r("#cookie_alert__text a").css({color:"#"+t}),r("#cookie_alert__ok").css({background:"#"+t,color:"#"+n}),setTimeout(function(){"1"!=c&&(console.log("0"),i.css("margin-bottom","0"))},1e3)}r("#cookie_alert__ok").click(function(){i.css("margin-bottom","-1000px"),Cookies.set("cookie_ok","1",{expires:365})}),"loading"===document.readyState||(e=1,o()),r(window).on("load",function(){0==e&&o()})}});
Не хватает функционала
или не справились?

Напишите нам, мы окажем необходимые услуги
и сделаем возможные доработки.