Simple Scripts to Password Protect Webpages

By Posted 2005 Updated   BloggingSecurity

Here are some simple password protection scripts to password protect webpages. Some web pages are best kept private. The javascripts below are simple ways to protect using a password your webpage.

LIMITATIONS

password protection scripts

  • As I said, these scripts are very simple javascript. They are the first line to protect privacy of webpages. Someone who can access the html page source code can easily find the username and password and enter the page. Anyone with a little idea about html and computers can see the source code.
  • The script will NOT work in Javascript disabled browsers or older browser versions not supporting javascript. So it is basically to stop routine surfers from accessing your pages.

So if you have something IMPORTANT that you really want to password protect and not allow any access at all, DO NOT USE these and try alternative means.

USAGE – Insert the code in between the HEAD html  tags of your webpage. Remember to replace our url ‘quickonlinetips.com’ with the url of your webpage.

Password Protection Script 1

The javascript displays a form to enter the Username and Password. If either is wrong, it will display and alert screen like ‘Wrong Username’ or ‘Wrong Password’. The username is set to ‘secretname’ and the password is ‘secretpassword’ – both can be set as you like. If both are right, then you are taken to the next url, which is currently set to this blog.

<script language="javascript">
function pasuser(form) { 
if (form.id.value=="secretname") { 
if (form.pass.value=="secretpassword") { location="http://quickonlinetips.com/" } 
else { alert("Wrong Password") } 
} 
else { alert("Wrong Username") } 
} 
</script>
<form name="login">
Username: < input name="id" size="6" type="text">
Password: < input name="pass" size="6" type="password">
<input value="Login" onclick="pasuser(this.form)" type="button">
</form>

Password Protection Script 2

Insert this code in the ‘Head’ tags of the web page. When you enter the page, it will ask for a password, currently set to ‘secretpassword’. If the password is correct, you will be allowed to enter the page. Otherwise you can set it to redirect to any other page, currently it is set to this blog.

<SCRIPT language="JavaScript">
var password; 
var pass1="secretpassword"; 
password=prompt('Enter Password',' '); 
if (password==pass1) 
alert('Correct Password! Click OK to Enter!'); 
else { window.location="http://quickonlinetips.com/"; 
} 
</SCRIPT>

Insert these scripts into your html code for simple password protection of your pages. But remember the warning as mentioned before.


62 comments on “Simple Scripts to Password Protect Webpages

  1. Kya says:

    Any idea why I can’t get any of those scripts to work on my blog??? Could it be blogger blocking it? Please help!!! THANK YOU!

  2. CrAz1iA957 says:

    I just see the scripts (Both) printed in my blog instead of implemented. Why doesn’t it work?

  3. hope this helps says:

    u have to remove the comments….so u remove the 2nd and the 2nd last line

  4. Jade says:

    I did what you said and it still doesn’t work

  5. Mark & Mandy says:

    works for me. nice post. simple, and stops the average person. i used the 2nd script.
    thanks — mark

  6. despus says:

    I’ve been thinking… (I don’t know the Java language) how about using some one-way coding algorithm, so it could be more secure (the page storing the encoded form of the pw). something like this

  7. Anonymous says:

    Works for me too. Thanks for the script. I have one question though. I noticed that the password prompt only appears when I type my Blogspot address exactly as it’s shown to me when I log in and go under Settings and then Publishing (ie. without the ‘World Wide Web’ part of the address). Is there a way to get the prompt to show up even with different variations of my address? By typing in my address starting with ‘www’, people can still access my blog without the password. Thanks in advance. I’m not very computer savvy. Any help would be appreciated.

  8. Anonymous says:

    I just have a basic blogger blog – do I enter the codes into the ‘Template’ section? If so, where in the Template html do I enter it? I’ve tried to enter it into the ‘head’ section and the password isn’t coming up…

    Thanks for your help!

  9. Jess says:

    Hi;

    I’m really keen to use these scripts, I’ve tried both html codes but I can’t seem to get the passwords to work. I would be really grateful. I’m mostly just getting the text appear at the top of my blog. Thanks heaps – awesome website!

  10. Quick Online Tips says:

    Please see that the all code inbetween the script tags of the code is inserted between the HEAD tags of your page. Maybe that is why the text is showing on your blog.

  11. shannon says:

    i’m sorry but i still don’t get it. Can you please show me an example? Thanks alot

  12. zac says:

    it only appears on top of the screen. help?

  13. Sriram says:

    I want to password block this because i have friends who want to gain access and i need help because words keep croping up and i can’t telll them to go away

  14. jason says:

    where should i put my script one?

  15. QuickOnlineTips says:

    Insert the code between the HEAD tags. Otherwise it will not work and will display on the page.

  16. f3l says:

    if someone has javasript disabled, and hits “view source”, he can see the url pointed to, and later continue into the “secret data” with litle or no effort (he can see the pass too, since it’s in clear text, inside the page).

    this is no substitute for a decent ldap, or server side security system, shich is a must when data is really private.

    also if you want your data be even safer, you mst use SSL for the transmisison as well.

    let’s just hope this doesn’t get used wide spread.

    just in case you WANT to use this script, just make shure you dont make the password “null”

  17. Henry says:

    Can I add more than one username and password?

  18. Porter says:

    I couldn’t get any in-template tags to work, but I did get a password working by altering the tag:

    Also, I added this to the styles in the :

    body {visibility:hidden}

    This way, when the page loads, all my blog content is hidden, so if they get redirected they never see anything, but if the password is correct, the body is set to be visible.

  19. blurrkidd says:

    I just cant get it to work..it become text on the top..and then my blog will come out..I need help..I dont understand!!

  20. fizz says:

    thanks, been looking for a simple password protect that you can put on the page itself. works like a charm.

    for the second script, you need to take out the , as well as _ before both SCRIPTs.

    in BlogSpot, yeah, put it between the head tags in the Edit HTML part.

    sure, any decently experienced person can hit view source, and anyone using Opera can just check the ‘disable javascript’ checkbox on the prompt, but it keeps out the masses.

    thanks!

  21. milo says:

    i tried using de java scrpiy, but it does not seem to work,
    it jus keep appearin at de top of de blog..
    plz help on where to put..
    thanks

  22. milo says:

    where is “in between the HEAD tags of your webpage”

  23. Alex says:

    When you say insert it between the head tags, where are these head tags? I don’t know which ones they are, can you make a screen shot possibly? Defining the exact location of where to input the HTML? Thank you.

  24. justme says:

    I have tried BOTH scripts, modified without _ , and put right after Head tags, and they are not working!

  25. sad says:

    just like justme. i have tried both scripts. deleted the _, put it between the head tags. yet, they’re not working! any clue?

  26. joanL says:

    I have used the second version and it is working fine – thanks. The only thing I am struggling with is that unless you enter the correct password it is impossible to get back onto the website without without having to close and re-open the browser. In case any genuine users have forgotten the password and want to come back to the password-protected area later but surf the rest of the website in the meantime, can you provide code for an additional message such as ‘you have entered an incorrect password, please re-enter here or continue to browse the website here’?

  27. joanL says:

    SORRY please ignore above comment as I have worked out what was going wrong. However, is there any way the password can appear as asterisks when people type it??

  28. turnip says:

    hi i’ve a problem i inserted the second script on my blogger account in between the head tags as it is. but it still doesn’t show up. any clue what to do?

  29. wingyan says:

    hello. I’m using xanga, but I tried and it cannot really work. Can you reply to my email? thanks alot

  30. greg says:

    Erm a little help here.. im currently using blogspot.. im not exactly tech savvy.. so could someone please detail alittle where im supposed to put in the html for this? i’ve tried in between the and .

  31. greg says:

    Erm a little help here.. im currently using blogspot.. im not exactly tech savvy.. so could someone please detail alittle where im supposed to put in the html for this? i’ve tried in between the and .

    thanks in advance.

  32. Sarah says:

    Just to be clear, the scripts above will work on a basic blogspot.com account? Meaning that if we send the URL to family/friends it will prompt them for a password before they are able to view the contents of the blog? Thank you!

  33. dette says:

    Hello! I have inserted the 2nd script as well in between the head tags, but when I view my site, the password prompt does not come up at all.

    Help? I’m also using this for a Blogger blog.

    Thanks – I’ve been searching online for a script like this, and yours is BY FAR the simplest one. :)

    Looking forward to hearing back from you!

  34. Pila says:

    Give nosle a shot. http://nosle.com

    You can protect any webpage or blog by adding 3 lines of code. No programming experience is required. It also provides a management console on its site where you can control access for your users. Javascript is required, which is the case for 99.99% of all websites today.

  35. clarice says:

    Hello. Nosle doesn’t work for me, I think it’s so difficult to understand and navigate through that site.
    With regards to this post, I have tried BOTH codes and pasted them both as they are and they have not worked. All I get are some of the html coding appearing at the top of my page.
    Is there anyone out there who can help me, please?

    Thanks in advance.

  36. Anonymous says:

    You can try filling in the gap between the “<” and the “input name” so it looks like this; Username:Password:. Hope it helps!

  37. Hi says:

    Try this code. Username:Password:. It worked for me. I hope this helps!

  38. Hi says:

    Username:Password:. This code works!

  39. Hi says:

    Ok, every time I click Login, it says error on page.
    HELP!

  40. Kate Wardwell says:

    Hello,

    I love the idea of your scripting here – it’s exactly what I’ve been searching for for weeks! I needed something simple to grant access to client account pages…nothing crazy. The only problem is I tried the second code – nothing happened. So I tried the first one and all it shows is the info I want to password protect along with this at the top:

    Username: Password:

    Please help!

    Thanks in advance!
    Kate

  41. Kate Wardwell says:

    To make this clearer – nothing shows up on the page except for the last half of the code:

    Username: Password:

    Thanks

  42. Rose says:

    Hi! Thanks for this blog entry. I’m using the second code with blogger, but it’s making me enter the password even when I’m editing the page. Do you know what’s wrong?

  43. Janice says:

    Hey, i tried everything. I tried the username:password:. thing & it still doesn’t work. Could you please post up step by step plus screenshots. Thanks ;D

  44. Manik says:

    Hey guys just to tell you if you use this script anyone can get in no matter what password or username you use because if you view the page source you can see everything….I don’t want to be rude to the person you made this script, but I felt like warning you..

  45. Phoebe says:

    hey, I can’t seem to get the code to work.
    I tried both,
    I put it in between the HEAD area,
    but it doesn’t show
    Does it have anything to do with the fact that my HEAD area stretches all the way to the end of my blogskin’s HTML code?
    please reply by email and not by here.
    Thank you. (=

  46. Fledermaus says:

    RE: Comment by Manik | 6/10/08 #

    As was stated,
    “Hey guys just to tell you if you use this script anyone can get in no matter what password or username you use because if you view the page source you can see everything.I don’t want to be rude to the person you made this script, but I felt like warning you..”

    The above should be a REAL concern to all and not to be disregarded. I know, most web crawlers don’t know about the Page Source routine, but all it takes is for someone “in the know” to tell someone who’s “ignorant” of it and your password is broken.

    I hope you have better suggestions for password protection, like maybe a scrambling technique or something else.

    • prentist says:

      Hey Fledermaus
      all javascript code can be placed in a separate *.js file and link to html page by using (script language=javascript src=”yourjavapswdcode.js”)

      hope this clears up your concern

  47. Shads says:

    Hi guys – I have it working.

    Open your web page in a TEXT EDITOR. Within the first few lines there should be a line

    html

    (in triangular brackets) and then

    head

    (also in triangular brackets) and after a bit

    /head

    (and again) In between the lines containing and paste all of script 2, and DELETE the Triangular Bracket Exclamation Mark — from the 2nd line and the — Triangular Bracket from the 6th line. To change the website you go to if you get the wrong password, change http://quickonlinetips.com/ to what you want. To change the password, change secretpassword too what you want.

    This is not a secure password, but works for sites that you would prefer to be private, e.g. space for family/friends etc.

  48. Anonymous says:

    Does this only work on html editors like Dreamweaver or free website editors too?

  49. Ken says:

    I got the first one working – many thanks.

    • Dominic says:

      I cant seem to get any of the 2 codes working with my Blog this is the error that appears
      Please correct the error below, and submit your template again.
      Your template could not be parsed as it is not well-formed. Please make sure all XML elements are closed properly.
      XML error message: The content of elements must consist of well-formed character data or markup.

      Anyone got any ideas

  50. Rob says:

    I have inserted the script and when page loads I do get the password box, however, if I click ok on empty input box or cancel or type anything in the box, the page still loads. Any ideas?

  51. Belinda says:

    I am having a similar problem to Rob, I have used the second code… it is Simple & Brilliant. I used it on my index page below the title which is below the and it does not allow the page to load but keeps my page white and no tool buttons are able to be pressed (to get the source) until the code is entered, then it opens up my index page… HOWEVER if I press the cancel button or the X in the top right hand corner of the password box it bypasses the password and goes straight to the index page that i am trying to protect. any chance of adding something to the code to prevent the cancel and the X button being presses or if it is presses follow the path of an incorrect password???? please. This is the best code i have seen except for this little problem
    Thanks

  52. Kymberly says:

    I know how to paste it in – that’s fine.

    I’ve followed every tip or trick here. No dice.

    It simply does not work. I have the nice little code in between the tags and all but it simply doesn’t have any effect. I just need something simple so I can break up with Typepad and go to Blogspot without the extended family giving me a hard time. They feel better with a “password entry” blog.

  53. FAO says:

    The second one works although it took a bit of fiddling about with. I’m certainly no expert in website programming however for anyone else who is struggling I will try and give a slightly clearer description. You need to take out the first triangle bracket and exclamation mark and two dashes and space at the beginning of the second line just before the word var. Then you also need to remove the two dashes and triangle bracket on the penultimate line. Leave in the forward slashes at the end and the script, and other bits. This worked for me and I hope it helps.
    FAO

  54. Saru says:

    Hey FAO, thank you for your tips.
    Finally i get it to work.
    TQ all

  55. coma says:

    So, could someone please show the full working script and kindly explain exactly where it needs to slip on. Am so confused… Thanks.

  56. B says:

    take all the spaces out of anything that is not inside tags and it will work anywhere within the body tags of your webpage

  57. prentist says:

    Re comments by Fledermaus

    all javascript code can be saved in a separate *.js file and link it to html page via

    does this clear up ur concern?

    hey ur not being rude… brain teaser maybe…

  58. Laury says:

    I put the script to protect a page of my website, but now when I go to the editor page, it doesn’t allow me to edit anything, it redirects me to the non-edit version of the page. Any suggestions as to how to remove the code?

Leave a Reply

Your email address will not be published. Required fields are marked *




css.php