Всплывающее окно. Окно 18+

В статье рассмотрим, как сделать всплывающее окно для магазина, для оповещения посетителя. К примеру, это может пригодиться для создания сообщения о подтверждении возраста посетителя старше 18 лет. 

Для вывода такого сообщения необходимо подключить модуль "РЕКЛАМНЫЙ POPUP", подробнее в инструкции Всплывающее окно. после подключения модуля в настройках модуля в поле "Заголовок окна" можете указать любой заголовок, например: "Внимание!" (рис. 1).

Рисунок 1.

В поле "Верстка всплывающего окна" нажимаем кнопку "Исходник" (рис. 2).

Рисунок 2.

В открывшееся окно вставляем следующий скрипт:

<style type="text/css">
  .module-popup-on-mainpage .cross {width: 0px; height: 0px;}
  .modal.module-popup-on-mainpage {background-color:#fff;}
  .modal .title {text-align: center; color: #000;}
  .p1 {text-align: center; font-size:16px; font-weight:bold; color: #000; line-height: 1.5;}
  .p1 a {padding-right:20px; color: #000;}
</style>

<div class="p1">
  <p>Данный сайт может содержать материалы для взрослых.<br> Чтобы продолжить, подтвердите, что вам уже исполнилось 18 лет.</p>
   <a href="http://домен/">Да, мне уже есть 18</a><a href="https://multilandia.ru/" style="pointer-events: auto;">Нет, мне нет 18 лет</a>
</div>

Сохраняем изменения. Пример на (рис. 3).

Рисунок 3.

Если требуется, чтобы при нажатии на ссылку, что ему есть 18, клиент оставался на той же странице, где всплыло окно, необходимо последний блок в предыдущем коде заменить на код ниже:

<div class="p1">
  <p>Данный сайт может содержать материалы для взрослых.<br> Чтобы продолжить, подтвердите, что вам уже исполнилось 18 лет.</p>
<a data-modal-close="popupOnMainPage"href="">Да, мне уже есть 18</a><a href="http://multilandia.ru/" style="pointer-events: auto;">Нет, мне нет 18 лет</a>
</div>

В клиентской части отображение всплывающего окна будет такое:

Рисунок 4.

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

Готово, мы рассмотрели, как сделать всплывающее окно предупреждение для магазина.