Загружать Magnific Popup раз в 15 дней для нового пользователя

У меня есть форма подписки на информационный бюллетень, которую я хотел бы загружать (всплывать) только один раз каждые 15 дней, иначе это может немного раздражать. В настоящее время я использую этот код jquery для загрузки всплывающей формы при загрузке страницы.

<div id="test-popup" class="white-popup mfp-hide">
Popup Form
</div>

<script>
jQuery(window).load(function(){
jQuery.magnificPopup.open({
items: {src: '#test-popup'},type: 'inline'}, 0);
});
</script>

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


person mikenichols    schedule 27.02.2015    source источник
comment
Я бы установил срок действия файла cookie каждые 15 дней. если это ложно / просрочено. показать всплывающее окно. stackoverflow.com/questions/8103128 /   -  person Radio    schedule 27.02.2015
comment
Вы должны сохранить его в базе данных   -  person w3spi    schedule 27.02.2015
comment
Раньше я использовал этот скрипт cookie с colorbox, но мне интересно, как это сделать для Magnific Popup?   -  person mikenichols    schedule 27.02.2015
comment
‹script type=text/javascript› jQuery(document).ready(function(){ if (document.cookie.indexOf('visited=true') == -1) { var пятнадцать дней = 1000*60*60*24* 15; var expires = новая дата((новая дата()).valueOf() + пятнадцать дней); document.cookie = Visit=true;expires= + expires.toUTCString(); true, href:#subscribe}); } }); ‹/скрипт›   -  person mikenichols    schedule 27.02.2015


Ответы (3)


Вы можете использовать localStorage для этого.

$(window).on('load', function() {
  var now, lastDatePopupShowed;
  now = new Date();

  if (localStorage.getItem('lastDatePopupShowed') !== null) {
    lastDatePopupShowed = new Date(parseInt(localStorage.getItem('lastDatePopupShowed')));
  }

  if (((now - lastDatePopupShowed) >= (15 * 86400000)) || !lastDatePopupShowed) {
    $.magnificPopup.open({
      items: { src: '#test-popup' },
      type: 'inline'
    }, 0);

    localStorage.setItem('lastDatePopupShowed', now);
  }
});
<div id="test-popup" class="white-popup mfp-hide">
  Popup Form
</div>

Вы можете увидеть рабочий пример здесь: http://codepen.io/caio/pen/Qwxarw.

person Caio Tarifa    schedule 27.02.2015
comment
'localStorage' кажется довольно полезным методом. - person vaneayoung; 27.02.2015

функции для создания и чтения файлов cookie:

function createCookie(name,value,days) {
    if (days) {
        var date = new Date();
        date.setTime(date.getTime()+(days*24*60*60*1000));
        var expires = "; expires="+date.toGMTString();
    }
   else var expires = "";
   document.cookie = name+"="+value+expires+"; path=/";
}

function readCookie(name) {
    var nameEQ = name + "=";
    var ca = document.cookie.split(';');
    for(var i=0;i < ca.length;i++) {
        var c = ca[i];
        while (c.charAt(0)==' ') c = c.substring(1,c.length);
       if (c.indexOf(nameEQ) == 0) return c.substring(nameEQ.length,c.length);

    }
    return null;
}

создать куки на 15 дней:

createCookie('run_popup',true,15);

чек за прошедшие 15 дней

if(!readCookie('run_popup'))
... code for run popup...
person vaneayoung    schedule 27.02.2015

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

В этой теме вы можете найти материал для быстрого начала работы с файлами cookie.

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

person NenadP    schedule 27.02.2015