Part1: What do I need to get started?
Since I am doing this locally on my machine For this to work you will need to have the software below installed. Also if you want to apply this to your live web site, your hosting company need to run PHP MYSQL

1. WAMP5 : http://www.wampserver.com/en/index.php

2. EMS SQL Manager for MySQL (WAMP5 comes with a sql manager, you can use it, or which ever one you are familiar with. 

Download and install both software, if you installed wamp5, by default it would create a folder located in C:\wamp\www\, create two more folders inside the www\ directory called localroot and the other webroot.

Part2: Creating the database and tables.

Start up EMS and click on the create new database icon.

Create a new database with the name, pixel_db and click next, and you will see the window below.

Click next and Finish. When you do that you should see the Registration database window. Just click ok. We need to create the user to access the database click on the User Manager Icon . Change the Servers to Localhost and click ok. At this point click on the Add User Icon when you do that you will see the window below.

This is just a demonstration, so your username and password will be different. Make sure to select All Privileges and With Grant option. With that click ok to apply the settings.

Double click on the database you just created.

When you do that you will connect to the database where you will be able to see the tables.

With that click on the Create new table icon shown below. Name the table login

With that it should send you into the Table Properties window. Click on the Fields tab.

Double click on the Column Name and change the information according tot he image below. When you are finish click ok.

id Field

Username Field

Password Field

At this point your Table Fields should look like the image below.

With that click on Compile after your tables has finished compiling click on Data

Click on  to Insert Record. Fill in the information shown below. The id is an auto increment so you don't need to do anything with that.  . After each data entry make sure to click on Post Edit

Part3: Setting up Dreamweaver and creating the form.
Start up Dreamweaver and click New Site Manage Sites..

and click New Site. Click on the Advanced Tab and you will see the window below. Click on Local Info and fill in the information shown.

Local Info

Remote Info

Testing Server

When you are finished click ok, Done

Create a new php page and name it login.php

Copy and paste the code below into your page.

by doing that you will get the form below.

Part4: Connecting to the Database and setting up login form..

Click on the Shown in the databases tab and click on MySQL Connection.

With that the window below will come up. Fill in the information shown below.

This information has to match up with what you created using EMS, The password I used is pixel

Next click on Select, select the pixel_db database and click ok twice.

Click File New... and click on Dynamic Page PHP and click Create. Hit Ctrl+S and save your site as  index.php. Write a simple message on the index page "It Works"

Once your database is connected, click Insert Data Object User Authentication Log in user.

You will see the form below, fill in the corresponding information.

Click ok when you are finished. Now test the page, make sure you upload the file by clicking on the Put File(s) icon.

Part5: Restrict access to your pages.

Open the Index page you previously created. Click Insert Data Object User AuthenticationRestrict Access to Page.

Select the setting Above. Click ok when you are finish. Now if you go directly to the index page it will redirect you to the login page and prompt you for a password.

We need to add a little script to prompt the user when the have entered the wrong password or username.

<?php if(isset($_GET['failed']) && $_GET['failed'] == "1") { ?> <span class="failed">Your Login Was Unsuccessful - Please Try Again</span> <?php } ?>

Copy the code above and paste it below the login form as shown below. Remember you have to paste it in code view.

Switch to code view and locate the code shown below.

Modify the Failed login line to $MM_redirectLoginFailed = "login.php?failed=1";

Now save and test the page input a wrong user name or password and you will see the prompt.

Finished:
Well that is it.

This Tutorial was Created By Mark
© 2011 pixeldigest.com. All Rights Reserved.

CSS mouse over Table

In this tutorial I will teach you how to create a CSS mouse over Table effect to change the background color of a table using Dreamweaver.
... Read more