форма для входа

1
Онлайн всего: 1
Гостей: 1
Пользователей: 0
1
05-08-2018 в 14:53 490

Уведомление о том что на сайте используются cookies


Уведомление о том что на сайте используются cookies
Всем привет! как вы знаете сейчас на всех сайтах практически стоят уведомления о том что сайт использует cookies и пользователь должен согласится с этим и после окошко скрывается

Так вот я решил предложить свой вариант такого блока уведомления
по суте н не отличается от большинства скриптов такого рода просто я его сделал боле привлекательным так как на сайтах где я их видел они просто портят дизайн и вызывают желание закрыть данный сайт так же сразу скажу что данный блок не имеет фиксированного места положения и будет оставаться там где вы его поставите тем самым не будет надоедать пользователям



Установка


Скопируйте код ниже и вставьте его в то место где хотите видеть данное уведомления

Код
<script type="text/javascript">
$(document).ready(function(){
$("#setCookie").click(function () {
$.cookie("popup", "24house", {expires: 0} );
$("#bg_popup").hide();
});
   
if ( $.cookie("popup") == null ){$("#bg_popup").show();}
else { $("#bg_popup").hide();}
});
</script>

<div id="bg_popup" style="display: none;">
  <div id="popup">
  <a id="setCookie" class="closeCooki" href="#" title="Согласиться и Закрыть" onclick="document.getElementById('bg_popup').style.display='none'; return false;">Согласиться</a>
<div class="cont_bc">
  Этот сайт использует файлы cookies для более комфортной работы пользователя. Продолжая просмотр страниц сайта, вы соглашаетесь с <a href="ССЫЛКА НА СТРАНИЦУ С ПРАВИЛАМИ">Политикой использования файлов cookies</a>.
</div>
</div>
</div>


Текст меняем на свой и не забываем указать ссылку на страницу с описанием правил.

Теперь нам нужно подключить стили блока для этого копируем код ниже и вставляем его в таблицу стиле в самый конец

Код

#bg_popup{
position: relative;
background: #333 url("../img/zz.png") no-repeat center;
color: #FFF;
width: 100%;
padding: 15px;
padding-right: 150px;
}
   
#setCookie {
  position: absolute;
  top: 0;
  bottom: 0;
  margin: auto 0;
  right: 30px;
  color: #FFF;
  display: inline-block;
  background: rgba(0,0,0,.1);
  padding: 0px 15px;
  line-height: 30px;
  height: 30px;
  border-radius: 20px;
}
#setCookie:hover {background: rgba(0,0,0,.3);}

.cont_bc {max-width: 900px;}
.cont_bc a {
  color: #FFF;
  font-weight: bold;
  text-decoration: underline;
}


Отлично не забываем сохранить!

Обратите внимание на вот эту строчку в коде выше
Цитата
background: #333 url("../img/zz.png") no-repeat center;

Данная строчка отвечает за фон блока

#333 цвет фона
url("../img/zz.png") фоновое изображение ( звёздочки ) можно поменять на свои или просто удалить

Теперь подключим файл cookies

Для этого вам нужно скачать архив и загрузить всё что там есть к себе в файловый менеджер
Картинку в папку img
Скрипт jquery.cookie в папку js
За тем добавить на все страницы перед закрывающим тегом /body вот такою строчку
можно и в глобальный блок нижняя часть

Код
<script src="/js/jquery.cookie.js"></script>


Отлично не забываем сохранить а так же скачать архив и загрузить его к себе если вы всё сделали то вам нужно
по чистим кеш и куки в браузере что бы увидеть результат


Комментарии

Комментариев пока нет!
Добавлять комментарии могут только зарегистрированные пользователи.

[ Регистрация | Вход ]

Автор


Похожие материалы

Реклама



Дополнение

Демонстрация результата либо показана на отдельной странице, либо просто показана на скриншоте. В исключительных случаях, когда нет возможности показать работу даже на скриншоте, используется развернутое описание. Описание есть у каждого материала, этот пункт важен, но иногда описание бывает косвенным, пустословным. Это относится к тем материалам, которым не нужна детальная инструкция.

Установка скриптов – иногда не быстрый процесс. На страницах с описаниями всегда указывается место, куда нужно вставить приложенный код. Если требуется редактирование настроек в Панели управления, то об этом тоже пишется. Если никакой информации об установке нет, значит, код можно ставить в любом месте на сайте, преимущественно в сайдбаре. Прежде чем редактировать страницы, настоятельно рекомендуем делать резервное копирование шаблонов. Этот совет по большей части для новичков.

Гость
Ваша корзина
Ваша корзина пуста
ttalantlev.ucozru