Password protect directories
There are several reasons why you may want to password protect directories such as if you run a members only site where the "members" section should only be accessed by members, if your site is in beta stage and you only want a few select people to see it as it is currently, or if you have private information in a few directories that you don't want anyone to see.
Javascript
If you do password protection through Javascript then anyone can take a look at the source code and see what the password is. How secure, right? If anyone suggests you do Javascript password protection....run, run far far away.
Control panel
You can set password protection through your web hosting control panel. Log in to the control panel and browse around until you find what you need. If you are unable to locate the password protection area, try to find the solution through a search engine or call your web hosting company and they should help you out with it.
.htaccess/.htpasswd password protection
You can set password protection using two special files on your web server - .htaccess and .htpasswd. The .htpasswd file stores a list of username/password pairs that can access a directory and the .htaccess file specifies where to find the .htpasswd file.
The .htaccess file
Place the .htaccess file in the directory that you want to password protect. If you place the .htaccess file in the root directory of your webserver than your entire website will be password protected.
The first line specifies the location of the .htpasswd file. This is NOT a URL but an actual path on the web server. If you don't know the path structure on your web server call your web hosting company and they should help you out with it.
The second line says that only validated users (those who enter correct username/password) can access this directory. The third line sets the message that will be issued to the user when asked for the username/password. The fourth line says that this a basic authentication.
The .htpasswd file
Place the .htpasswd file in a directory where the .htaccess file can access it. Put the username:password combinations each on a separate line (separated by a colon, and the password encrypted).
To get the encrypted version of a password go to md5encrypter.com and the tool over there will perform the encryption for you (make sure you remember the actual password!).
When you try to access a protected directory, the password you enter will be encrypted and checked against the encrypted password in the .htpasswd file.
Password protect a single file
To password protect a single file instead of an entire directory, use the same instructions as above and add this line to the end of your .htaccess file:
where file.html is the name of the file you want to password protect.