7/21/2019 Modul Koneksi Database http://slidepdf.com/reader/full/modul-koneksi-database 1/26 CaraInst l PHP ini adala memban webserv lengkap FTP Ser anda bis adanya p Dan kele versi 4 k window Install X XAMPP XAMPP InstallX Jalankan Tentuka kelanjutan un sebuah r local kita erdiri dari ver 0.9.39, kunjungi aket dari X bihan dari e 5. Bagi an disini. MPP di w sudah terin di windows MPPstep programny drive temp artikel sebe ebsite ber akan mengg pache 2.2. Tomcat 7.0 ebsitenya ( MPP ini a AMPP ada a yg belu lumnya me asis php m unakan XA 1, MySQL .21 (with m ttp://www. an memuda PHP switch memiliki buat webs sql dibutuh PP, karen 5.5.16, PH od_proxy_ pachefrien hkan kita m didalamny AMPP sila te sendiri, kan webser program i 5.3.8, ph jp as conn s.org/en/xa embuat web dari php v kan downl ang dimana er dan untu i memiliki MyAdmin ctor) untu mpp-windo site dengan rsi 5 ke ver ad XAMP untuk membuat aket yang 3.4.5, FileZ lebih jelas s.html). De platform P i 4 atau dar 1.7.4 for illa ya ngan P. i ndows sang tal di komp . 1kemudian at anda aka at mudah se ter anda. B lik next, ja menyimpa kali anda la erikut ini a ngan klik c hasil extra kukan, ting alah bebera al klik next pa langkah dan oke eng-install ncel heheh c dari XA P. Jika suda h klik next
This document is posted to help you gain knowledge. Please leave a comment to let me know what you think about it! Share it to your friends and learn new things together.
Jika muncul tampilan seperti gambar di bawah, centang saja semua
Install XAMPP step 3
Kemudian akan muncul proses extrack file XAMPP, tunggu sampai proses selesai, kemudiantinggal next/ok, jika semua proses berjalan dengan lancar maka akan muncul XAMPP ControlPanel Application, klik start pada bagian kanan Apache dan Mysql sehinggal status menjadi
Proses installasi XAMPP berakhir. gampang kan? silahkan cek dengan mengetikkanhttp://localhost pada browser anda. Jika muncul seperti gambar di bawah berarti proses install
xampp berhasil dan berjalan dengan baik,
Semoga tutorial di atas dapat membantu,
ikuti tutorial berikatnya “Layout Website Dengan Photoshop“
Kalau sudah, klik kembali di dalam kotak tersebut, lalu klik Insert > Form > Button, pada Id isi
login terakhir klik Ok. Untuk merubah tulisan di dalam tombol login tersebut ubah Value‘nya
pada panel Properties.
Sampai disini, jika anda perhatikan melalui Code View maka kodenya akan seperti ini :
1
2
34
56
7
89
10
111213
14
1516
17
1819
20
21
2223
<f ormi d=" f orm1" name="f or m1" met hod="post " act i on=""> <t abl e cel l spaci ng="5" cel l paddi ng="5"> <t r > <t d>Nama</ t d> <t d>: </ t d> <t d><l abel > <i nput t ype="t ext " name="nama" i d="nama" / > </ l abel ></ t d> </ t r > <t r >
<t d>Passwor d</ t d> <t d>: </ t d> <t d><l abel > <i nput t ype="t ext " name="passwor d" i d="passwor d" / > </ l abel ></ t d> </ t r> <t r al i gn="r i ght "> <t d col sp n="3"><l abel a > <i nput t ype="submi t " name="l ogi n" i d="l ogi n" val ue="Logi n" / > </ l abel ></ t d> </ t r> </ t abl e></ f or m>
Simpan pekerjaan anda Ctrl + S, kemudian preview tekan F12
Sampai disini dulu tutorial membuat halaman login di Dreamweaver CS3 saya akan lanjutkan
tutorialnya membuat halaman login pada artikel berikutnya Membuat Halaman Login Part 2.
Melanjutkan tutorial sebelumnya Membuat Halaman Login sekarang saya akan lanjutkan
dengan Membuat Halaman Login Part ‐2.
Sebelum Membuat halaman login ini, buatlah 2 file php baru, beri nama :
1.
home.php 2. login‐gagal.php
Simpan dalam folder fileadmin
File home.php ini adalah halaman depan administrator anda, sedangkan login-gagal.php iniadalah halaman yang dituju jika password dan username yang dimasukkan tidak cocok, isikan
saja file login-gagal.php dengan kata – kata
“Ooops, login gagal. Silahkan coba kembali”
Pada kata Silahkan coba kembali berikan link menuju halaman index.php.
Buka kembali file index.php milik anda, klik Insert > Data Objects > User Authecation > Log
In User
Setelah muncul jendela Log In User, isikan pengaturannya seperti gambar berikut
ya cukup sekian tutorial membuat halaman login di dreamweaver cs kali ini, silahkan simpan pekerjaan anda tekan CTRL + S kemudian preview tekan F12, jika anda mencoba form login
tersebut maka anda akan di bawa kehalaman login gagal, karena kita belum mengisi data2 dalam
table admin dalam database websiteku.
Tutorial berikutnya kita akan membuat halaman register admin atau form register untuk
administrator.
Membuat Halaman Register
Halaman register tentunya berisi form register atau formulir pendaftaran. Setelah
kemarin tutorial membuat halaman login part 1 dan part 2, sekarang saatnya kita belajar
membuat halaman register untuk administrator dengan Adobe Dreamweaver CS3.
Pertama anda buat file php baru, simpan dalam folder fileadmin milik anda, dan beri nama
register.php.
klik Insert > Data Objects > Insert Record > Record Insertion From Wisard
Setelah muncul jendela Record Insertion From, isikan pengaturannya sebagai berikut :
• Connection : pilih koneksi yang telah anda buat, kalau belum ada koneksi, silahkan baca
tutorial membuat koneksi dengan dreamweaver cs3
• Table : pilih table admin, tabel yang anda buat dalam database milik anda. Jika anda belum membuat database silahkan di baca tutorial Membuat database Mysql
• After inserting, go to : isikan file index.php yang berada dalam folder fileadmin, agar
setelah anda mendaftar akan langsung di bawa ke halaman login.
• Form fields : klik tulisan id kemudian hilangkan dengan meng-klik icon (-)
• Terakhir klik ok.
Selanjutnya kita akan memberikan fungsi MD5 pada form register, melalui code view tekan
CTRL + F (find) ketikkan
1Get SQLVal ueSt r i ng( $_POST[ ' passwor d' ] , "t ext" ) ) ;
kemudian klik Find Next, jika sudah ketemu ubah kodenya seperti ini
1Get SQLVal ueSt r i ng( md5 ( $_POST[ ' password' ] ) , " t ext " ) ) ;
Simpan pekerjaan anda tekan CTRL + S kemudian preview teken F12, coba daftar kemudian
test login dengan nama dan password yang telah anda buat tadi, kalau berhasil maka anda akandi bawa ke halaman home.php.
jadi kode keseluruhannya menjadi seperti ini :
12
3
4
56
7
89
101112
13
14
151617
18
19
20
2122
2324
25
2627
28
<?php r equi r e_once( ' . . / Connect i ons/ websi t eku. php' ) ; ?><?php i f ( ! f unct i on_exi st s( "Get SQLVal ueSt r i ng") ) { f uncti on GetSQLVal ueSt r i ng( $t heVal ue, $theType, $theDef i nedVal ue = "" ,$theNot Def i nedVal ue = "" ){
$t heVal ue = get _magi c_quotes_gpc( ) ? st r i psl ashes( $t heVal ue) : $t heVal ue;
$t heVal ue = f unct i on_exi st s( "mysql _r eal _escape_st r i ng") ?mysql _r eal _escape_st r i ng( $t heVal ue) : mysql _escape_st r i ng( $t heVal ue) ;
$edi t For mAct i on = $_SERVER[ ' PHP_SELF' ] ;i f ( i sset ( $_SERVER[ ' QUERY_STRI NG' ] ) ) {
$edi t For mAct i on . = "?" . ht ml ent i t i es( $_SERVER[ ' QUERY_STRI NG' ] ) ; }
i f ( ( i sset ( $_POST["MM_i nsert " ] ) ) && ( $_POST[ "MM_i nsert " ] == " f orm1") ) {
$i nsert SQL = spr i nt f ( " I NSERT I NTO `admi n` ( nama, passwor d) VALUES ( %s,%s) " , Get SQLVal ueSt r i ng( $_POST[ ' nama' ] , " t ext " ) , GetSQLVal ueSt r i ng( md5 ( $_POST[ ' password' ] ) ,
" text" ) ) ;
mysql _sel ect_db( $dat abase_websi t eku, $websi t eku) ; $Resul t 1 = mysql _query( $i nser t SQL, $websi t eku) or di e( mysql _er r or ( ) ) ;
$i nser t GoTo = " i ndex. php" ; i f ( i sset ( $_SERVER[ ' QUERY_STRI NG' ] ) ) {
$i nser t GoTo . = ( st r pos( $i nser t GoTo, ' ?' ) ) ? "&" : " ? " ; $i nser t GoTo . = $_SERVER[ ' QUERY_STRI NG' ] ;
} header ( spr i nt f ( "Locat i on: %s", $i nser t GoTo) ) ;
} ?><! DOCTYPE ht ml PUBLI C "- / / W3C/ / DTD XHTML 1. 0 Transi t i onal / / EN" "ht t p: / / www. w3. or g/ TR/ xht ml 1/ DTD/ xht ml 1- t r ansi t i onal . dt d"><html xml ns="ht t p: / / www. w3. org/ 1999/ xht ml "><head><meta ht t p- equi v="Cont ent - Type" cont ent ="t ext/ ht ml ; char set =ut f - 8" / ><t i t l e>Unt i t l ed Document </ t i t l e></ head>
<body><f orm act i on="<?php echo $edi t FormAct i on; ?>" met hod="post " name="f or m1" i d="f orm1">
<t abl e al i gn="cent er "> <t r val i gn="basel i ne"> <t d nowr ap="nowr ap" al i gn="r i ght ">Nama: </ t d> <t d><i nput t ype="t ext " name="nama" val ue="" si ze="32" / ></ t d> </ t r> <t r val i gn="basel i ne"> <t d nowr ap="nowr ap" al i gn="r i ght ">Password: </ t d> <t d><i nput t ype="t ext " name="passwor d" val ue="" si ze="32" / ></ t d> </ t r> <t r val i gn="basel i ne"> <t d nowr ap="nowr ap" al i gn="r i ght "> </ t d> <t d><i nput t ype="submi t " val ue=" I nser t r ecor d" / ></ t d> </ t r>
</ t abl e> <i nput t ype="hi dden" name="MM_i nser t " val ue="f orm1" / ></ f or m></ body></ html >
Sebelum memulai tuorial membuat halaman administrator website atau halaman admin di
dreamweaver ini saya ingin meminta maaf kepada teman – teman yang megikuti tutorial
dreamweaver di Mous Design, lama saya tidak bisa melanjutkan tutorial ini karena banyakurusan kerjaan. Banyak yang mengirimkan email ke saya, meminta supaya cepat untuk di
updatekan tutorial pembuatan website dengan dreamweaver terutama membuat halaman
administrator website ini.
Pada tutorial dreamweaver sebelumnya saya sudah menjelaskan cara membuat halaman register dan halaman login utuk masuk ke halaman administrator, yang di mana halaman ini hanya admin
yang terdaftar saja dapat mengakses halaman ini. Di dalam halaman administrator ini anda dapat
membuat kategori artikel, menambahkan atau mengedit artikel anda.
Sekali lagi saya ingatkan tutorial membuat website dengan adobe dreamweaver cs 3 ini saya
berikan secara bertahap, jika anda kebingungan dengan tutorial yang ada disni saya harapkan
membaca tutorial ini dari awal, untuk melihat daftar isi tutorial dreamweaver anda bisa klik
disini.
Untuk membuat halaman administrator website yang pertama kitalakukan adalah membuat
layout
atau
tata
letaknya.
Buka file home.php yang ada di dalam folder fileadmin milik anda. Kemudian melalui codeview, ketikkan
1<l i nk hr ef ="st yl e. css" t ype="t ext / css" r el ="st yl esheet " / >
di atas tag </head>, kode tersebut fungsinya menghubungkan file home.php dengan file
style.css yang ada di dalam folder fileadmin milik anda.
Jika anda belum memiliki / membuat file style.css silahkan anda buat terlebih dahulu, caranyatekan Ctrl + N, pilih CSS kemudian click Create, simpan dalam
folder D:\website\xampp\htdocs\websiteku.com\fileadmin dengan nama style.css.
Masih tetap dalam tab home.php melalui code view, ketikkan kode berikut
Kode – kode tersebut membentuk link ke halaman yang lainnya, misalnya Profile di klik makaanda akan di bawa ke halaman editprofile.php, untuk penjelasan dan pembuatan halaman
tersebut akan saya jelaskan pada tutorial berikutnya.
Kembali klik New CSS Rule, isikan pengaturannya sebagai berikut :
• Selector Type : Advanced (Ids, pseudo‐class selectors)
• Selector : #navigasi ul
• Define in : style.css
Setelah muncul CSS Rule Definition for #navigasi ul in style.css, isikan pengaturannya sebagai
berikut :
Box :
• width : 900 pixel
•
float
:
left
• Padding : centang same for all isikan 0 pixel.
Jika sudah klik OK.
klik kembali New CSS Rule, isikan pengaturannya sebagai berikut :
• Selector Type : Advanced (Ids, pseudo‐class selectors)
• Selector : #navigasi li
• Define in : style.css
Setelah muncul CSS Rule Definition for #navigasi li in style.css, isikan pengaturannya sebagai
berikut :
Block:
• Display : inline
Box :
• Margin : hilangkan centang same for all, pada bagian Left isikan 10 pixel
<p>Sel amat dat ang di hal aman admi ni st r at or websi t eku, i si adal ah cont ohhal aman depan admi n websi t e ki t a, kata - kat a i ni hanya unt uk t est i ng pada
t utor i al pembuat an hal aman admi ni st r at or websi t e dan hanya sebagai cont ohhal aman admi ni st r at or websi t e, sel anj ut nya gant i t ul i san i si t er ser ah andamengi si nya dengan kat a - kat a mi l i k anda sendi r i , mi sal nya seper t i peri ngatanunt uk semua admi n yang memasuki hal aman admi ni st r at or websi t e. </ p>
<p>Sekal i l agi kat a - kat a dal amhal aman admi ni st r ator i ni bi sa anda gant idan t ol ong di gant i , kar ena kat a - kata i ni hanya sebagai cont oh semat a dant i dak ada maksud unt uk bel aj ar mengol ah kata, karena saya sendi r i sudahpusi ng unt uk mengol ah kata - kat a unt uk hal aman admi ni st r at or websi t ei ni . </ p>
</ di v>
Masih dalam tab home.php, klik New CSS Rule, isikan pengaturannya sebagai berikut :
• Selector Type : Advanced (Ids, pseudo‐class selectors)
• Selector : #conten
• Define in : style.css
Setelah muncul CSS Rule Definition for #conten in style.css, isikan pengaturannya sebagai
berikut :
Box :
• width : 900 pixel
• float : left
• Padding : centang same for all, pada kolom top isikan 10 pixel.
• margin : hilangkan centang same for all, pada bagian top isikan 20 pixel.
Border :
• Style : centang Same for all isikan solid.
• Width : centang same for all isikan 1 pixel
• Color : centang same for all isikan #CCCCCC
Jika sudah klik Ok. simpan semua pekerjaan anda tekan Ctrl + S.
Untuk melihat hasil jerih payah anda tadi atau melihat halaman administrator website anda
Untuk memperindah tampilan halaman administrator website anda, anda bisa menambahkan opsi
CSS yang lainnya, misalnya background dan lain – lain. Silahkan di coba – coba agar anda lebih
paham, lihat perubahannya pada file style.css.
Sekian dulu tutorial membuat halaman administrator website dengan Adobe dreamweaver cs 3 ,
pada tutorial berikutnya saya akan jelaskan bagaimana cara agar membatasi akses kehalamanadministrator website anda, jadi hanya orang yang terdaftar saja yang bisa masuk ke halaman
administrator website milik anda.
Jika anda ingin berlangganan artikel mous design anda bisa masukkan email anda di kolom
berlangganan yang ada di bagian kanan website ini, dan apa bila ada pertanyaan ataupun
komentar silahkan berkomentar di dalam form komentar di bawah.
Akhir kata saya ucapkan terima kasih banyak dan salam sukses untuk anda semuanya.
lanjutan tutorial Memberikan Batasan Hak Akses Administrator bisa di lihat di sini
Pada tutorial kali ini kita akan memberikan batasan hak akses administrator atau memberikan
hak akses ke halaman admin web, artinya jika ada pengunjung website yang jahi mencoba
mengakses halaman utama website kita dengan cara mengetikkan URL website, misalnya
mengetikkan “http://websiteku.com/fileadmin/home.php” maka orang yang mencoba mengaksesURL tersebut akan di bawa ke halaman logout dan diminta untuk login menggunakan username
dan password.
Setelah anda memiliki atau membuat halaman administrator yang saya sudah jelaskan pada
tutorial sebelumnya, langsung saja sekarang kita mulai memberikan batasan hak akses
administrator.
Buka program adobe dreamweaver anda, kemudian buat file php baru simpan dalam folder
fileadmin tekan Ctrl + S beri nama logout.php
Selanjutnya buka file home.php > pada menu bar klik Insert > Data Objects > User
Authentication > Restric Access To Page
Setelah muncut jendela Restric Access To Page isikan pengaturan sebagai berikut :
• Restric based on : Username and Password
• If Access denied, go to : klik brows pilih file logout.php
If Access denied, go to ini kira – kira maksudnya, jika ada user yang mencoba mengakseshalaman administrator website anda tanpa proses login maka orang tersebut akan di bawa ke
halaman logout.php
Silahkan coba ketikkan di browser anda “http://localhost/websiteku.com/fileadmin/home.php ”
maka secara otomatis anda akan di bawa ke halaman kosong.
Setelah tutorial ini saya akan jelaskan bagaimana cara membuat halaman logout <<diklik aja
linknya :D gak usah pikir panjang lagi heehehhe, caranya juga simple banget seperti
memberikan batasan hak akses ini.
Sebelum memulai tutorial Membuat Halaman Log Out ini saya minta maaf atas
keterlambatan update ini, karena banyak kesibukan jadi belum sempat update.
Kemarin terakhir kita sudah memberikan batasan hak akses halaman administrator , yang dimana jika ada user ingin mengakses salah satu halaman administrator tanpa melalui proses login maka
secara otomatis dia akan di bawa ke halaman log out.
Di halaman log out ini nantinya akan langsung mengarah kehalaman depan administrator dan
meminta user yang jahil tersebut untuk melakukan login terlebih dahulu.
Pertama jalankan program adobe dreamweaver milik anda, kemudian buka file log out.php yang
terdapat dalam folder fileadmin.
Setelah halaman log out / log out.php anda terbuka melalui code view hapus semua code yang
terdapat dalam file tersebut.
Selanjutnya pada menubar dreamweaver klik Insert > Data Objects > User Authentication >
Log out User
Setelah muncul window / jendela Log out user isikan pengaturannya seperti berikut :
Sudah… hanya itu saja caranya hahhahaha, sebenarnya simple banget, sekarang coba test driveketikkan “http://localhost/websiteku.com/fileadmin/home.php” pada browser anda, kalau sukses
anda akan tetap berada di halaman depan / halaman login administrator.
Sekarang coba login kehalaman administrator anda, kemudian klik link l og out pada navigasi,
kalau sukses maka anda tetap akan di bawa kehalaman login.
Cukup sekian tutorial membuat halaman log out, semoga dapat membantu.