Closing Auto Opening Modal and Browser Remembering

Shopify Partner
1 0 0

Hi everyone. I have been working on an auto opening modal. I am using Javascript to open the modal on page load as this needs to appear on every page of the website. It is an age verification pop up. I know there are apps out there but I wanted to use this as a learning experience.


My question is when the button is clicked, I need the modal to disappear and when the user visits other pages of the website I do not want this modal to auto load again. I have been told I could use localStorage to achieve this but I don't think that is possible with Shopify, I have been trying for days to try and get it to work.


If you have any suggestions I'd be grateful. The code is as follows:


  $("#myModal").on('', function(){
    localStorage.setItem('age-verified', true);

<!-- Modal -->
<div class="modal fade" id="myModal" data-backdrop="static" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
  <div class="modal-dialog">
    <div class="modal-content">
      <div class="modal-header">
        <a href="" class="close" role="button"><span aria-hidden="true">&times;</span><span class="sr-only">Close</span></a>
        <img class="img-responsive" style="margin:0 auto;" src="//" alt="">
      <div class="modal-body">
        <p class="modal-p">You must be at least 18 years old to enter this site.</p>
      <div class="modal-footer">
        <button type="button" id="over18" class="btn btn-default" data-dismiss="modal">I am 18 or older</button>
        <a href="" id="under18" class="btn btn-danger" role="button">I am under 18</a>