Вы находитесь на странице: 1из 5

Cara Membuat Form Sign Up dan Form Login Pada Web Design

dengan Menggunakan Macromedia


Untuk membuat Form sign up dan Login untuk pembangunan sebuah web
dengan berbasiskan member saat ini sudah menjadi tren bagi para
webmaster yang ingin membangun web yang look professional. Pada
artikel ini saya akan menjelaskan tutorial untuk membuat form sign up dan
login yang masih berbentuk sederhana. Untuk selanjutnya, anda dapat
membuat sendiri pengembangan dari script ini.
1. Langkah pertama, anda harus membuat file Config.php. File ini
berfungsi menghubungkan script yang anda buat dengan database. Isi dari
file config.php
ini dapat anda lihat di bawah:
<?php
$server = localhost; // server web anda.
$database = mydata; // nama dari database yang anda buat.
$db_user = myusername; // username dari mysql anda.
$db_pass = mypassword; // password untuk mengakses mysql anda
tersebut.
$table = users; //nama table yang akan dibuat di database.
?>
Simpan file tersebut di root web anda. Setelah selesai, anda dapat
melanjutkan pada tahap yang kedua.
2. Buat file dengan nama create.php. File ini berfungsi menjalankan
perintah query database dalam pembuatan table signup dan login ini. Isi
dari file ini dapat anda lihat dibawah.
<?php
include (config.php);
// connect to the mysql server
$link = mysql_connect($server, $db_user, $db_pass)
or die (Could not connect to mysql because .mysql_error());
// select the database
mysql_select_db($database)
or die (Could not select database because .mysql_error());
// create table on database
$create = create table $table (
id smallint(5) NOT NULL auto_increment,
username varchar(30) NOT NULL,
password varchar(32) NOT NULL,
PRIMARY KEY (id),
UNIQUE KEY username (username)

);;
mysql_query($create)
or die (Could not create tables because .mysql_error());
echo Mantap!!sekarang lanjut deh ke tahap yang ketiga;
?>
3. Sekarang anda perlu membuat form yang digunakan pengunjung untuk
sign up dan berikan nama register.html. File yang anda buat ini boleh
berupa halaman HTML biasa yang nantinya akan terhubung pada script php
yang nantinya anda akan buat. Untuk percobaan yang sederhana, anda
dapat mengkopi script di bawah pada halaman baru dreamweaver .
<html><head>
<title>User Registration</title>
</head><body>
<form action=register.php method=post>
Pick a Username: <input type=text name=username size=20><br>
Pick a Password: <input type=password name=password
size=20><br>
<input type=submit value=Sign Up>
</form>
</body></html>
4. Setelah itu buat file dengan nama register.php. File ini akan berfungsi
sebagai perantara yang menghubungkan file register.html diatas dengan
database yang sudah anda buat. Untuk isi dari file register.php" dapat
anda lihat dibawah.
<?php
include(config.php);
// connect to the mysql server
$link = mysql_connect($server, $db_user, $db_pass)
or die (Could not connect to mysql because .mysql_error());
// select the database
mysql_select_db($database)
or die (Could not select database because .mysql_error());
// check if the username is taken
$check = select id from $table where username = .
$_POST['username'].;;
$qry = mysql_query($check) or die (Could not match data because
.mysql_error());
$num_rows = mysql_num_rows($qry);
if ($num_rows != 0) {
echo Maaf ye, username $username sudah keduluan diambil orang.<br>;

echo <a href=register.html>Kata Wiswakarma, tidak boleh menyerah,


coba lagi deh..</a>;
exit;
} else {
// insert the data
$insert = mysql_query(insert into $table values (NULL, .
$_POST['username'].,
.$_POST['password'].))
or die(Could not insert data because .mysql_error());
// print a success message
echo Akun Anda Telah Selesai Dibuat!<br>;
echo Sekarang anda bisa <a href=login.html>Login sebagai member web
Wiswakarma</a>;
}
?>
5. Sekarang anda perlu membuat form member untuk Login. Beri file ini
dengan namalogin.html. Isi dari file ini yaitu sbb.
<html><head>
<title>User Registration</title>
</head><body>
<form action=login.php method=post>
Username: <input type=text name=username size=20><br>
Password: <input type=password name=password size=20><br>
<input type=submit value=Log In>
</form>
</body></html>
6. Sekarang anda perlu membuat file yang akan menghubungkan file
login.html dengan database, berikan nama file ini dengan login.php.
Scriptnya dapat anda lihat dibawah.
<?php
include(config.php);
// connect to the mysql server
$link = mysql_connect($server, $db_user, $db_pass)
or die (Could not connect to mysql because .mysql_error());
// select the database
mysql_select_db($database)
or die (Could not select database because .mysql_error());
$match = select id from $table where username = .$_POST['username'].
and password = .$_POST['password'].;;
$qry = mysql_query($match)
or die (Could not match data because .mysql_error());

$num_rows = mysql_num_rows($qry);
if ($num_rows <= 0) {
echo Sorry, there is no username $username with the specified
password.<br>;
echo <a href=login.html>Try again</a>;
exit;
} else {
setcookie(loggedin, TRUE, time()+(3600 * 24));
setcookie(mysite_username, $username);
echo You are now logged in!<br>;
echo Continue to the <a href=members.php>members</a> section.;
}
?>
7. perhatikan file tersebut pad baris ketiga paling bawah, disana berisi <a
href=members.php> members.php ini adalah sebuah area yang hanya
bisa dilihat oleh para member.
Anda dapat membuat file members.php dengan kreasi sendiri.
Sekarang saya akan menjelaskan script yang digunakan untuk mengecek
cookie, apakah orang tersebut sudah login atau tidak. Simpan scipt ini di
seluruh area members. Scriptnya sbb;
<?php if (!isset($_COOKIE['loggedin'])) die(You are not logged in!
log in);
$mysite_username = $HTTP_COOKIE_VARS["mysite_username"];
echo you are logged in as $mysite_username.
; ?>
8. script yang terakhir yaitu script untuk logout. Script ini dapat dihubungkan
dengan link pada html biasa. Link ini diletakkan pada area member. Untuk isi
scriptnya dapat anda lihat sbb:
<?php
// expire cookie
setcookie (loggedin, , time() - 3600);
echo You are now logged out.<br>;
echo <a href=\login.html\>Log in</a>.;
?>

Untuk Mengaplikasian dari script-script yang saya jelaskan di atas, dapat


anda kreasikan sendiri. Selamat berkreasi.!!!! :)

Вам также может понравиться