How to Use Cookies, Part II

Here you will find how to implement JavaScript cookie code on your site. The code will determine you how many times the visitor has loaded the page at your site.

You can use that number to:

• display a popup window on the first visit,
• display a special popup window depending on the number,
• display different page content for different numbers, and/or
• run other JavaScript functions depending on the number.

First, retrieve the JavaScript code from the demo page at
http://willmaster.com/a/6/pl.pl?art69

Lines 6 through 54 contain the required JavaScript cookie code. There is one variable, “DaysToLive” (on line 17), that you need to modify. The number you provide here is the number of days you want the cookie to remain on the visitor’s computer. No other changes are required, just copy and paste the cookie code into your own page — in the HEAD section just like on the demo page.

Lines 61 through 67 contain a function to launch a popup window. It could be any other function you want to run when the visitor has been at your page(s) a specific number of times, so feel free to customize or replace with your own.

Lines 85 through 102 are a demonstration of how to use the JavaScript cookie code. These lines, and how to customize them, are explained here.

The line:

visits = GetCookie(‘page_name’);

is where your page finds out how many times the visitor has been at your page(s). If it’s the first visit, the value in the variable “visits” will be the digit 1. If the second, the value will be 2, and so on. However, if your visitor has the browser’s cookies turned off, the number will not increment.

The parenthesis in the call to the GetCookie() function contains the name of the cookie that keeps count. (The name is between apostrophes.) In the example, the name is: page_name.

If you use this JavaScript cookie code only on one page, you can leave the cookie name as is, or use anything else you want (only alphanumerics and underscores, no spaces, in the cookie name). However, if you will use the cookie code on multiple pages, here are considerations:

• If you use the same cookie name on every page, the value in the variable “visits” will be the total number of page views for every page visited (every page that has the cookie code).
• If you use different cookie names, the value in the variable “visits” will be the number of page views only for the pages using that specific cookie name.

For example, you might have cookie name MyIndex for your index page and cookie name MyInterior for all the interior pages of your site. When your visitor loads your index page, the value of “visits” will be the number of times the visitor has loaded your index page. And when your visitor loads any of your interior pages, the value of “visits” will be the total number of times the visitor has loaded interior pages.

The lines:

if(visits == 1) {

	document.write('<h2>Welcome!</h2>');

}

if(visits == 2) {

	document.write('<h2>Welcome, again!</h2>');

}

if((visits >= 3) && (visits  9) {

	document.write('<h2>Welcome, loyal friend!</h2>');

}

determine the content of a heading on the page. If it is the first visit to the page (or group of pages), the heading is “<h2>Welcome!</h2>“.

If it is visit number 2, the heading is “<h2>Welcome, again!</h2>“.

If it is the third through ninth visit, the heading is “<h2>Welcome, friend!</h2>“.

And for every visit after the ninth visit, the heading is “<h2>Welcome, loyal friend!</h2>“.

Use the above example to put your own custom content on your page, content depending on how many times your visitor has loaded your page(s).

The lines:

if(visits == 1) { Popup('firstvisit.html',500,150); }

if(visits == 2) { Popup('secondvisit.html',500,150); }

if(visits == 15){ Popup('loyal.html',600,200); }

determine whether or not a JavaScript function is run, the determination depending on the number of times your visitor has loaded your page(s).

If it is the first visit to the page, the function Popup() is run to make a popup window 500 pixels wide and 150 pixels high. In the popup window will be the page found at URL firstvisit.html.

If it is the second visit, the function Popup() is run to make a popup window the same size as the first one. This time, the page in the window is secondvisit.html.

Then, when it is visit number 15, the function is run again. The window is 600 high and 200 wide; and contains the page at URL loyal.html.

You may substitute your own JavaScript functions. That makes your page very customizable.

That’s all there is to it!

“WillMaster Possibilities” ezine
http://willmaster.com/possibilities/
mailto:possibilities@willmaster.com