0
jQuery(window).load(function() {
   if(Cookies.get("cookie_popup<?php echo $ppid;?>") != 'hide_popup'){
  setTimeout(function () {
    jQuery('#front_add_popup').show();
    jQuery('#front_add_popup').addClass('show');
  }, 10000);
   }
});
jQuery(document).on("click", ".popup_cookie_btn", function ($) {   
   jQuery('#front_add_popup').removeClass('show');
   jQuery('#front_add_popup').hide();
  var date = new Date();
  var ex_time = <?php echo $cookie_expiration_time;?> * 60 * 1000;
  console.log(ex_time);
  date.setTime(date.getTime() + (ex_time));	
  console.log(date);     
    Cookies.set('cookie_popup<?php echo $ppid;?>', 'hide_popup', { expires: date, path: '/' })        
 });

<?php $ppid = get_the_ID();
$popup_disable = get_field('popup_disable');
$popup_image = get_field('image');
$popup_heading = get_field('heading');
$popup_sub_heading = get_field('sub_heading');
$popup_shortcode = get_field('shortcode');
$cookie_expiration_time = get_field('cookie_expiration_time_set_in_minutes');
 if($popup_disable!='true'){?>
 <div id="front_add_popup" class="modal modal<?php echo $ppid;;?> ">
   <div class="modal-dialog"> 
           <!-- Modal content-->
     <div class="modal-content">
       <button type="button" id="" class="popup_cookie_btn" data-dismiss="modal"><span>×</span></button>
       <div class="newsletter-content">
        <?php if($popup_image!=''){?>
          <div class="block-left">
            <figure> <img class="main-image" src="<?php echo $popup_image;?>" alt=""></figure>
          </div>
      <?php }?>
         <div class="block-right">
           <div class="inner">
             <h2><?php echo $popup_heading;?></h2>
             <h3><?php echo $popup_sub_heading;?></h3>
    <?php if($popup_shortcode!=""){echo do_shortcode($popup_shortcode);} ?>
           </div>
         </div>
       </div>
     </div>
   </div>
 </div>
 <?php
}

.modal{
  display: none;
     position: fixed;
     top: 0;
     bottom: 0;
     left: 0;
     right: 0;
     background: rgba(0, 0, 0, 0.7);
     transition: opacity 500ms;
     visibility: hidden;
     opacity: 0;
     z-index: 99999;
 }
 .modal.show{
  opacity: 1;
     visibility: visible;
 }

<script src="https://cdn.jsdelivr.net/npm/js-cookie@rc/dist/js.cookie.min.js"></script>

Jagdish Sarma Asked question May 8, 2021
Add a Comment