how to start intro.js tour only on first visit to website

Question

I have implemented intro.js to my website. But I wanted to start the tour only on first visit. may be by using cookies.. website is made with html no php..

I updated my answer with an example of how to run the intro. — Snowburnt, Oct 09 '13 at 14:09
Questions asking for code must **demonstrate a minimal understanding of the problem being solved**. Include attempted solutions, why they didn't work, and the *expected* results. See also: [Stack Overflow question checklist](http://meta.stackexchange.com/questions/156810/stack-overflow-question-checklist) — Danny Beckett, Dec 12 '13 at 07:08

score 11 · Accepted Answer · edited May 20 '16 at 01:26

JavaScript cookies are a solution although I should point out that it will only work for as long as the user keeps the cookie.

//set the cookie when they first hit the site
function setCookie(c_name,value,exdays)
{
var exdate=new Date();
exdate.setDate(exdate.getDate() + exdays);
var c_value=escape(value) + ((exdays==null) ? "" : "; expires="+exdate.toUTCString());
document.cookie=c_name + "=" + c_value;
}

//check for the cookie when user first arrives, if cookie doesn't exist call the intro.
function getCookie(c_name)
{
var c_value = document.cookie;
var c_start = c_value.indexOf(" " + c_name + "=");
if (c_start == -1)
  {
  c_start = c_value.indexOf(c_name + "=");
  }
if (c_start == -1)
  {
  c_value = null;
  }
else
  {
  c_start = c_value.indexOf("=", c_start) + 1;
  var c_end = c_value.indexOf(";", c_start);
  if (c_end == -1)
  {
c_end = c_value.length;
}
c_value = unescape(c_value.substring(c_start,c_end));
}
return c_value;
}

code is from http://www.w3schools.com/js/js_cookies.asp

obviously there's some blanks you'll have to fill in there, but it's a good starting point for working with cookies in javascript.

EDIT:

So you want to make a new function, put it in the head, inside script tags (if you have them already, just copy the function into there (you'll want to put the other two functions I provided within the script tag also)). This function will check to see if you have a cookie. If you do, just return. If you don't, create the cookie and run the intro,

<head>
<script type="text/javascript">
function checkCookieIntro(){
   var cookie=getCookie("mySite");

   if (cookie==null || cookie=="") {
      setCookie("mySite", "1",90);
      runIntro();  //change this to whatever function you need to call to run the intro
      }
}

</script>
</head>

now change your body to be:

<body onload="checkCookieIntro()">

so when the body loads it will check to see if a cookie exists, if it doesn't, create a cookie with a value of one that will last for 90 days (unless the user deletes it) and then run the intro. If the cookie does exist with a value then it does nothing.

I added tour start function to body onload.. so will the cookie stop the bod onload after i add your code.. — Aroo, Oct 09 '13 at 03:15
no, you have to add a conditional and call the cookie check and create functions. I'll write something up for you in a couple hours but I'd advise studying up on javascript so that you'll understand what's going on. — Snowburnt, Oct 09 '13 at 10:52

how to start intro.js tour only on first visit to website

1 Answers1