Как добавить баннер согласия на использование файлов cookie в Blogger

Просматривая Интернет, вы, вероятно, сталкивались с баннером согласия на использование файлов cookie, который просит вас принять или отклонить файлы cookie. Эти баннеры стали стандартной функцией на веб-сайтах из-за растущей озабоченности по поводу конфиденциальности данных и онлайн-отслеживания.

Если вы являетесь блоггером, использующим Blogger, необходимо добавить на свой сайт баннер с согласием на использование файлов cookie, чтобы обеспечить соблюдение таких нормативных актов, как Общий регламент по защите данных (GDPR) и Закон штата Калифорния о конфиденциальности потребителей (CCPA).

Что такое баннер согласия на использование файлов cookie ?

Баннер согласия на использование файлов cookie — это всплывающее окно или баннер, который появляется на веб-сайте, информируя пользователей об использовании файлов cookie и запрашивая их согласие на хранение или доступ к их информации.

Файлы cookie — это небольшие текстовые файлы, которые размещаются на устройстве пользователя при посещении веб-сайта. Они используются для запоминания пользовательских предпочтений, отслеживания активности на веб-сайте и предоставления более персонализированного опыта. Однако файлы cookie также могут использоваться для целевой рекламы или отслеживания, поэтому пользователи должны быть проинформированы и иметь возможность принять или отклонить их.

Добавление баннера согласия на использование файлов cookie на ваш сайт Blogger – относительно простой процесс, который можно выполнить за несколько шагов. В следующих разделах мы расскажем, как добавить баннер согласия на использование файлов cookie в Blogger.

Как добавить баннер согласия на использование файлов cookie в Blogger

Чтобы добавить баннер или всплывающее окно с согласием на использование файлов cookie в Blogger, выполните следующие действия.

1. Откройте панель инструментов Blogger и перейдите в раздел темы.
2. Теперь щелкните раздел редактирования HTML в раскрывающемся меню справа от кнопки настройки.
3. Теперь найдите закрывающий тег Body (</body). Обычно это вторая последняя строка кода вашей темы.
4. Теперь вставьте данный код прямо над ним и сохраните код, чтобы добавить баннер согласия на использование файлов cookie на свой веб-сайт Blogger.

 <div class='cookie-box'> <div class='cookie-row'> <div class='cookie-img'><svg viewBox='0 0 97.93 97.93' xmlns='http://www.w3.org/2000/svg'><path d='M44,23.76a2.47,2.47,0,1,0,.91,3.37A2.47,2.47,0,0,0,44,23.76Z'></path><path d='M25.9,40.32a2.47,2.47,0,0,0,0,4.93h0a2.47,2.47,0,1,0,0-4.93Z'></path><circle cx='32.08' cy='65.86' r='2.47'></circle><path d='M56.38,69.91a2.47,2.47,0,1,0,1.14,1.49A2.47,2.47,0,0,0,56.38,69.91Z'></path><path d='M72,52.68a2.47,2.47,0,0,0-2.38,1.83,2.44,2.44,0,0,0,.25,1.87,2.47,2.47,0,0,0,4.52-.59,2.44,2.44,0,0,0-.25-1.87A2.47,2.47,0,0,0,72,52.68Z'></path><path d='M89.51,52.86A14,14,0,0,1,81,47.2,14.09,14.09,0,0,1,61,35.68,14.09,14.09,0,0,1,49.49,15.73a14,14,0,0,1-5.66-8.55,44,44,0,0,0-21.09,6.15A44.26,44.26,0,0,0,71.46,87.08,44.24,44.24,0,0,0,89.51,52.86ZM28.28,43.42a2.47,2.47,0,0,1-2.38,1.83h0a2.47,2.47,0,1,1,2.38-1.83Zm3.8,24.9a2.47,2.47,0,1,1,2.47-2.47A2.47,2.47,0,0,1,32.08,68.32ZM44.92,27.13A2.47,2.47,0,1,1,44,23.76,2.47,2.47,0,0,1,44.92,27.13ZM57.28,73.27a2.47,2.47,0,1,1-.9-3.36,2.47,2.47,0,0,1,.9,3.36ZM74.42,55.79a2.47,2.47,0,1,1-.25-1.87A2.45,2.45,0,0,1,74.42,55.79Z' fill='#7577a9'></path><path d='M97.93,48.52v-.2A2.35,2.35,0,0,0,95.7,46a9.37,9.37,0,0,1-8-5.45,2.35,2.35,0,0,0-3.49-.93,9.51,9.51,0,0,1-5.44,1.72A9.4,9.4,0,0,1,69.39,31.1a2.35,2.35,0,0,0-2.55-2.55c-.28,0-.57,0-.85,0a9.39,9.39,0,0,1-7.68-14.81,2.35,2.35,0,0,0-.93-3.49,9.37,9.37,0,0,1-5.45-8A2.35,2.35,0,0,0,49.61,0H49a49,49,0,1,0,49,49C97.93,48.82,97.93,48.67,97.93,48.52ZM71.46,87.08A44.26,44.26,0,0,1,22.74,13.33,44,44,0,0,1,47.53,4.72a14,14,0,0,0,5.66,8.55A14.09,14.09,0,0,0,64.71,33.22,14.09,14.09,0,0,0,84.66,44.75a14,14,0,0,0,8.56,5.66A44.3,44.3,0,0,1,71.46,87.08Z'></path></svg></div> <div class='cookie-content'> <p>Our website uses cookies to improve your experience. <a href='https://policies.google.com/technologies/cookies' target='_blank' title='Learn more'>Learn more</a></p> <button class='cookie-buttons'>Accept!</button> </div> </div> </div> <style> .cookie-box.hide{display:none} .cookie-box { position: fixed; width: 90%; margin: 20px; max-width: 400px; min-height: 100px; background-color: #ffffff; box-shadow: 25px 12px 25px 12px rgb(30 30 30 / 4%); z-index: 990; border: 2px solid lightgrey; border-radius: 6px; bottom: 15px; right: 0px; padding: 15px; } .cookie-row { position: relative; display: -webkit-box; display: -ms-flexbox; display: flex; text-align: left; align-content: center; justify-content: center; align-items: center; } .cookie-img{padding-right:20px} .cookie-img svg{fill:#333;width:60px;height: 60px;} .cookie-content p { position: relative; width: 100%; display: inline-block; font-size: 15px; color: #666666; margin-top: 0!important; } .cookie-content pa{text-decoration:underline;} .cookie-buttons { position: relative; width: 100%; margin-top: 10px; float: left; background-color: #7577a9; font-family: inherit; font-size: 14px; color: #ffffff; text-decoration: none; opacity: 1; border: none; cursor: pointer; font-weight: 500; padding: 5px; border-bottom: 2px solid rgba(0,0,0,0.1); border-radius: 6px; } </style> <script>//<![CDATA[ cookieChoices = {}; const cookieBox = document.querySelector(".cookie-box"), acceptBtn = cookieBox.querySelector("button"); acceptBtn.onclick = ()=>{ document.cookie = "CookieByKey2Blogging; max-age="+60*60*24*30; if(document.cookie){ cookieBox.classList.add("hide"); }else{ alert("Cookie can't be set! Please unblock this site from the cookie setting of your browser."); } } let checkCookie = document.cookie.indexOf("CookieByKey2Blogging"); checkCookie != -1 ? cookieBox.classList.add("hide") : cookieBox.classList.remove("hide"); //]]></script>

Этот код удалит уведомление о файлах cookie Blogger по умолчанию и добавит настраиваемый баннер согласия на использование файлов cookie, или вы можете сказать всплывающее окно на своем веб-сайте Blogger.

Этот код полностью оптимизирован и использует коды SVG, поэтому вам не нужно беспокоиться о скорости сайта на сайте блоггера.

В заключение, добавление баннера согласия на использование файлов cookie на вашем сайте Blogger необходимо для обеспечения соблюдения правил конфиденциальности данных и обеспечения прозрачности для ваших пользователей.

Я надеюсь, что эта статья поможет вам добавить настраиваемый виджет согласия на использование файлов cookie на веб-сайт блоггера. Если у вас есть какие-либо проблемы с этим кодом, дайте мне знать в разделе комментариев.

Кстати, вы можете нанять меня для оптимизации скорости загрузки вашего Blogger. Посетите нашу страницу услуг, чтобы узнать больше.