Gate Keeper Password Protection - Tested in IE7.0, Netscape8.1.2, Opera9.10, Firefox2.0.0.1 and AOL Explorer1.5

T he "Gate Keeper" script provides very extensive password protecting for a page. This is perhaps one of the best JavaScript password protectors out there you can use to restrict access to some or all of their web pages. This can be accomplished without the need for CGI scripting or server based authentication methods.

We have tested the code in IE7.0, Firefox2.0.0.1, Opera9.10, Netscape8.1.2 and AOL Explorer1.5. This script worked well in all platforms with no variations observed.

W e do not feel at this time a full tutorial is required for this script. The site where you get the code has an excellently detailed tutorial covering just about every aspect of the script. We will cover just two or three points that are not covered* and can be quite pertinent. One has to do with the use of the backslash/forward slash / (whichever you call it) at the end of URLs in this script. The other point we will cover has to to with page names.

* After our final note, we will show you howto add the "Cancel Login" button on the little pop-up page where you would put your password. This is not part of the script but a little extra we will show you howto.

Note Of Importance: On the page you are going to have this effect on or any page that will link to the page with this effect is on. Be sure of one thing within either the linking URL or the URL this effect is on. (Especially the page the form button with "Enter Here" is on). Be sure you "Do Not" have the backslash-forward slash / (which ever you call it) at the end of the linking URL. If you do, you will not get the correct pop up page ( gatekeep.html* ) that you can enter the password. If this sounds confusing, see the below example:
* The page named "gatekeep.html" is explained on the page you get this script script.

Right Way: https://www.angelfire.com/ny5/consigliere/gatekeeper.html
Wrong Way: https://www.angelfire.com/ny5/consigliere/gatekeeper.html/

S elect the links above to see what we are explaining about the Correct and Incorrect URL address.

O nce you select the two above links, (one at a time) when you open the Wrong Way link, select the "Enter Here" button and it will take you to the same page you are on instead of the page where you can login.

The last thing we shall cover is the simple fact that any page name within your domain will allow access to that particular page with "The Gate Keeper". For example, instead of entering the password that will access our example (password: "gatekeeper2" without the quotation marks, you can enter any of our page names (we have over 1500) and it will allow you access. Just for arguments sake, use the password "htmlcourse" (no quotation marks) and see what happens. It will now take you to our Basic HTML Web Design Course.

What this means simply is that any page name within your domain
(Our domain is https://www.angelfire.com/ny5/consigliere)
with a page name after your domain can be accessed from the "Gate Keeper" by placing the page name into the login box. (without the .html extention). Our web design course URL is https://www.angelfire.com/ny5/consigliere/htmlcourse.html. So to access this page with "The Gate Keeper", just put in the login box htmlcourse.

A s we stated earlier, below we will show you howto add the "Cancel Login" button on the login page. Basically, all that button does is close the pop-up window with a javascript command and we changed the words on the button. You can add this effect on the new page you will build "gatekeep.html".(Fully explained on the script site). This little addition will be incorporated within the <BODY> section of the code. See the below example:

<TR>
<TD WIDTH=50% ALIGN=CENTER VALIGN=BOTTOM>
<CENTER>
<FORM NAME="testform">
<INPUT TYPE="text" NAME="inputbox" VALUE="" size=20>
<INPUT TYPE="button" NAME="button" Value="Submit Password" onClick="goForit(this.form)">


<P><FONT SIZE=1 FACE="COMIC SANS MS"><A
HREF="http://junior.apk.net/~jbarta/weblinks/gate_keeper/" TARGET="_blank"><B>Gate Keeper</B></A></FONT>

</FORM>

</CENTER>

</TABLE>

</BODY>
</HTML>

The above words "Cancel Login" can be changed to whatever suits you. This is your preference. These are just the words that you will see on the form button.

We hope our tutorial was easy to follow and we covered everything in detail. If you would like to add this effect into your pages, grab the respective below link and you are there. If you have any problems with this or anything else, feel free to consult our [ FAQ ] and if you can't find the answer there, [ contact us ].
[ Get Code Here ] [ Rate This Page ]