Display Bootstrap Modal First Time Page Loads

I'm trying to display a bootstrap modal when a person first visits a page (after logging into my app). I want to use the modal to offer a 'Getting Started' video and also offer a '

Solution 1:

To do this, you'd need to use a means to store data about the user that persists between website visits, which is generally referred to as a session. In this particular case, it sounds like the users might not be logged in, which is referred to more specifically as an anonymous session.

There are a number of options available to you for storing anonymous sessions. The quickest and easiest would be using cookies, but other options include file-based sessions, Html5 storage, or databases.

From what you've written, I'd say that cookies are probably the best solution for you.

And, as you might expect, Django has built in functionality to ease working with cookies. I suggest looking into the documentation on Django sessions, which I find to be really accessible and easy to learn from, to see how to implement this.

If you have any more specific questions about using cookies (or anonymous sessions) in Django, just let me know and I'll try to help.

Solution 2:

You can use jquery.cookies.js in combination with modal.js to load the page only once then set an expiry cookie.

<scriptsrc="/path/to/jquery.cookie.js"></script><script>
            $(document).ready(function() {
                 if ($.cookie(‘pop’) == null) {
                     $(‘#myModal’).modal(‘show’);
                     $.cookie(‘pop’, ’7');
                 }
             });
            </script>

You can find more details in this tutorial:

http://calebserna.com/bootstrap-modal-email-subscription-form/

Solution 3:

Show Bootstrap Modal first time page load

<scriptsrc="//cdnjs.cloudflare.com/ajax/libs/jquery-cookie/1.4.0/jquery.cookie.min.js"></script><scripttype="text/javascript">
 $(document).ready(function() {
     if ($.cookie('pop') == null) {
         $('#myModal').modal('show');
         $.cookie('pop', '1');
     }
 });
</script>

You can set number of days to hide modal

Solution 4:

Well, you could use the localstorage for storing the action that happend, so it is persistant or you could use a cookie for example called shown and set it to false at the beginning and after the modal is shown you just set it to true.

Solution 5:

There would certainly be ways to do this with Django. You could store the user's IP, for example, and track whether or not a user at that IP has ever hit the "don't show this again" button. This would be the only real way to know for sure that you weren't showing the video to someone who had requested not to see it. On the front end, users can always clear out their own cookies or local storage so front end tracking can get lost.

That said, here's an actual example, since you mentioned being new to JavaScript:

// When the user clicks the button...localStorage.setItem('no_display', 'true');

// When a user visits the page...var no_display = localStorage.getItem('no_display');
if (no_display !== 'true') {
  display_the_modal();
}