How to Password Protect a Page or Directory on Your Site

Posted on - Last Modified on

In this article I am going to explain you the various ways to protect a webpage or a directory from Web bots and casual visitors. Please note that this is not for protecting credit card information pages or any valuable information.

The three ways are:
⦁    Client-side protection with JavaScript
⦁    Server-side protection with PHP codes
⦁    Htaccess protection of directories through htpasswd

Client-side protection with JavaScript

On the page you want to protect you can just write a simple JavaScript:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "">
<html xmlns="">
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Password Protected page</title>
<script type="text/javascript">
var s ="";

while (s!= "mypassword")
s=prompt("please enter your password");
if (s=="mypassword")
window.location.href="correct.html"; //page to redirect if password entered is correct

alert("Incorrect password-Try again");



Save the code above as default.html or index.html on your website and redirect to the page you want to password-protect if the password is entered correctly. The main disadvantage of this is that the password is easily visible. You can save the Javascript as a separate file and include it the HTML but anyone can easily view the Javascript file. 

The best way is a server-side check so it’s not easily visible.

  client side protection

Server-side protection with username and password using PHP codes

Server-side, you can write a simple form page with a username and password. You can even store the username and passwords in the database and retrieve them to check when the login form is posted for successful login.

// db connection string
    if(!@$conn) {
        echo "<h1>Unable to Establish Connection to the Server</h1><hr noshade size=2 color=#000000>";
    if(!@$db_sel) {
        echo "<h1>Unable to Connect to the Database</h1><hr noshade size=2 color=#000000>";

// Submit button click 

$uname = $_POST['uname'];
$pass = $_POST['pass'];
   $sign=mysql_query("select * from ".ADMINLOGIN." where  username='$uname' and password='$pass'");
//if username and password matches
        // redirect to the password protected page
         echo "<meta http-equiv='refresh' content='0;url=home.php'>";        
     Else{ // if username password entered is wrong
Echo “invalid password”;


<table width="100%" border="0" cellspacing="0" cellpadding="0">
                  <td width="100" height="43" align="left" valign="top" style="padding-left:20px"><span class="style3">&nbsp;User Name :</span></td>

                  <td width="118" align="left" valign="top"><input type="text" name="uname" value="<?=$uname;?>" class="style3" size="18"/></td>
                  <td align="left" valign="top" class="style3" style="padding-left:20px">&nbsp;Password :</td>
                  <td align="left" valign="top"><input type="password" name="pass"  class="style3" size="18"/></td>

                  <td height="37" colspan="2" align="center" valign="top"><table border="0" cellspacing="0" cellpadding="0">
                        <td width="100">&nbsp;</td>
                        <td width="118" height="37" align="center" valign="middle">
                        <input type="submit" name="submit" value="Login" class="button"  />                          </td>

Protection of Web directories using htaccess and htpasswd

This is a method used in Apache servers to protect Web directories provided your shared hosting allows htaccess. Open a notepad or any text editor and save the code below as .htaccess.

AuthName "My Secured Area”
AuthType Basic
AuthUserFile /path/to/your/directory/.htpasswd
require valid-user

Then you can create any number of username passwords needed and store them as an htpasswd file in the location not easily accessible by users in the Web space. Htpasswd files can be easily generated with online htpassword generation tools.

Upload the .htaccess to your Web root or the directory you wanted to protect, save the htpasswd in an area not easily accessible by users, and you're done. Whenever you access your website it will prompt a login. 

Wordpress protection 
Wordpress admin by default provides options to password-protect a page. In the visibility section on the right side, you have the option to password-protect a page and enter the password needed for protection and publish your page. That’s it! 

wordpress password protect

I hope you find this article useful.

Posted 9 December, 2014



************ TOP 5 WOMEN FREELANCERS *********************** About ME ************* DN Infoway is an offshore outsourcing company providing round-the-clock services to customers. We are a small team of 10 people, 7 coders and 3 designers. We offer round the clock services in web design and developmen...

Next Article

How to Create a Microsoft Login Button Using PHP