Простой popup на jQuery + Cookies

Покажу Вам простой код с использованием jQUery и Bootstrap, который можно быстро установить на любой сайт, без использования плагинов.

Также в коде используется cookie для исключения повторных показов пользователям.

Подключаем стили и скрипты

<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" > <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js" ></script> <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script> <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery-cookie/1.4.1/jquery.cookie.js" ></script>

Добавляем код popup на bootstrap

<div id="myModal" class="modal fade" role="dialog"> <div class="modal-dialog"> <div class="modal-content"> <div class="modal-body"> <h3>Здесь пишем Ваш текст уведомления</h3> </div> <div class="modal-footer"> <button type="button" class="btn btn-default" data-dismiss="modal">Закрыть</button> </div> </div> </div> </div>

Добавляем jQuery код

<script> $(document).ready(function() { if($.cookie("popupnotify") == null) { $('#myModal').modal('show'); $.cookie("popupnotify", "2"); } }); </script>

P.S. если Вы используете CMS, то возможно у Вас уже будет подключен bootstrap.min.css, bootstrap.min.js и jquery.min.js. Тогда их подключать не нужно, останется только подключить jquery.cookie.js.