Membuat CMS PHP MySQL Menggunakan Dreamweaver CS4 (Part 2)

skrng kita blajar lg bkin CMS sederhana dengan menggunakan bahasa pemrograman PHP MySQL dan menggunakan Adobe Dreaweaver CS4
sbelumnya kita download dulu sourcenya CMS HN , klo udah extract di root direktori Ikuti @agielwidianto web server ente.
Ikuti @agielwidianto disini kita bkin tiga (3) buah tabel MySQL, yaitu tabel: users, post , category , Berikut adalah rincian ketiga tabel tersebut:

users

Code:

CREATE TABLE IF NOT EXISTS `users` (

  `ID` int(10) NOT NULL AUTO_INCREMENT,

  `name` varchar(64) NOT NULL,

  `username` varchar(64) NOT NULL,

  `password` varchar(64) NOT NULL,

  `updated` timestamp NOT NULL DEFAULT CURRENT_TIMESTAMP ON UPDATE CURRENT_TIMESTAMP,

  PRIMARY KEY (`ID`)

) ENGINE=MyISAM DEFAULT CHARSET=latin1 AUTO_INCREMENT=1 ;

post

Code:

CREATE TABLE IF NOT EXISTS `post` (

  `ID` bigint(20) unsigned NOT NULL AUTO_INCREMENT,

  `title` text NOT NULL,

  `category` varchar(500) NOT NULL,

  `content` text NOT NULL,

  `updated` timestamp NOT NULL DEFAULT CURRENT_TIMESTAMP ON UPDATE CURRENT_TIMESTAMP,

  PRIMARY KEY (`ID`)

) ENGINE=MyISAM DEFAULT CHARSET=latin1 AUTO_INCREMENT=1 ;

category

Code:

CREATE TABLE IF NOT EXISTS `category` (

  `ID` int(10) NOT NULL AUTO_INCREMENT,

  `category` varchar(100) NOT NULL,

  PRIMARY KEY (`ID`)

) ENGINE=MyISAM DEFAULT CHARSET=latin1 AUTO_INCREMENT=1 ;

MEMBUAT FORM TAMBAH ADMIN: add-admin.php
1. Buka file add-admin.php
2. Hapus tulisan “Form add-admin disini”, di sana kita akan membuat form tambah Admin
3. Klik Insert > Data Objects > Insert Record > Record Insertion Form Wizard. Jendela baru akan muncul, lakukan beberapa konfigurasi seperti di bawah ini.

Quote:Connection: koneksi, (nama koneksi yg kita buat sebelumnya)
Table: users
After inserting, go to: admin.php (pake browse jg boleh)

.

4. Cari kode <table align=”center”> trus ubah jd <table align=”center” class=”data-table”>. Lakuin juga perubahan pada button, cari kode berikut <input type=”submit” value=”Insert record”> lalu ubah value-nya menjadi <input type=”submit” value=”Add admin”>

5. Copy code <input type=”submit” value=”Add admin”> tersebut, lalu Paste di sampingnya lalu ubah menjadi: <input name=”Reset” type=”reset” value=”Reset”>. Perubahan/hasil akhir dari dua buah button tersebut menghasilkan kode seperti ini: <input type=”submit” value=”Add admin”><input name=”Reset” type=”reset” value=”Reset”>

6. Sekarang kita udah punya dua buah button, yang satu untuk Add admin dan yang satunya adalah tombol Reset

7. Simpan lg file add-admin.php, coba di browser. kita udah berhasil membuat dan mengaktifkan form tersebut.

Spoiler Show

Lakukan ujicoba memasukkan bebeberapa nama, username dan password. Setiap kali selesai menambahkan nama, username dan password, kita akan dialihkan ke halaman admin.php

MEMBUAT LISTING ADMIN, MENAMBAHKAN DYNAMIC LINK EDIT DAN DELETE: admin.php

Langkah selanjutnya adalah menampilkan listing admin/user yang telah kita input ke dalam database td sehingga kita bisa mengaturnya, mengedit dan menghapusnya. Berikut adalah langkah-langkahnya:

1. Buka file admin.php, bukalah dengan Design View
2. biar sama persepsi, kita samain workspace dulu. Klik Windows, lalu pastikan hanya menu Properties, Bindings, Appiclation Bar dan file admin.php yang diberi tanda check (checked), jika ada selain menu-menu tersebut, silakan dinonaktifkan dengan mengklik/unchecked pada menu tersebut. Menu Bindings akan muncul di sebelah kanan workspace Anda, di sana Anda juga akan menemukan tombol tanda plus (+).

3. Klik tanda plus (+) tersebut, lalu pilih/klik Recordset (Query). Jendela Recordset akan keluar. Lakukan beberapa konfigurasi seperti pada langkah berikut ini:

Quote:Name: rsUser, (penamaan recordset/query di sini adalah bebas)
Connection: koneksi
Table: users
Sort: name. Klik drop down menu pertama, lalu pilih kolom name, lalu pada drop down menu kedua, biarkan nilai ASCENDING tetap seperti semula. Ini artinya kita akan mengurutkan namanya berdasarkan abjad.

Klik Test untuk mengetes query , jika kita telah memasukkan data user/admin sebelumnya, maka kita akan melihat nama user diurutkan berdasarkan abjad. Klik OK untuk menutup jendela Test
Klik OK sekali lagi. kita telah berhasil membuat query. Pada menu Bindings, kita akan melihat Recordset (rsUser) telah muncul.

4. di panel binding, Klik icon/tanda plus (yang berada dalam jendela Recordset (rsUser) yang berbackground putih. Di sana kita akan melihat kolom tabel user secara detail yang terdiri atas ID, name, username, password, dan updated

5. Cari tulisan “Name & username disini”, lalu hapus tulisan tersebut. Di sana kita akan mengisinya dengan dynamic data yang telah kita simpan dalam tabel user.

6. Melalui panel/menu Bindings dan Recordset (rsUser), klik kolom tabel name, lalu drag/tarik/seret menuju teks yang telah duhapus td

7. Lalu cari tulisan “2012-02-22 09:00″, kemudian hapus
8. Melalui panel/menu Bindings dan Recordset (rsUser), klik kolom tabel password, lalu drag/tarik/seret menuju teks yang telah kita hapus td.

MEMBUAT LINK DINAMIC EDIT
1. Seleksi tulisan “Edit”, lalu klik kanan > Make link kemudian jendela Select File akan muncul. Buka folder admin, lalu klik file edit-admin.php

2. Masih di jendela Select File, klik tombol Parameters yang berada di sebelah kanan bawah. Klik tombol Parameters tersebut. Jendela Parameters akan muncul yang otomatis akan membuka kolom Name

3. Pada kolom Name, ketik edit, lalu klik pada kolom Value, sejajar dengan tulisan edit. kita akan diminta untuk mengisinya, klik icon/tanda petir untuk memberikan dynamic value dari tabel user. Jendela Dynamic Data akan keluar. Pilih kolom ID (Jika kolom ID tidak keluar, klik tanda plus dari Recordset (rsUser).

4. Klik OK sebanyak tiga kali untuk menyelesaikannya. Hasil dari langkah ini nantinya akan menghasilkan link http://localhost/hn/admin/edit-admin.php?edit=

MEMBUAT LINK DINAMIC DELETE
1. Seleksi tulisan “Delete”, lalu klik kanan > Make link kemudian jendela Select File akan muncul. Buka folder admin, lalu klik file edit-admin.php
2. Masih di jendela Select File, klik tombol Parameters yang berada di sebelah kanan bawah. Klik tombol Parameters tersebut. Jendela Parameters akan muncul yang otomatis akan membuka kolom Name
3. Pada kolom Name, ketik delete, lalu klik pada kolom Value, sejajar dengan tulisan delete. kita akan diminta untuk mengisinya, klik icon/tanda petir untuk memberikan dynamic value dari tabel user. Jendela Dynamic Data akan keluar. Pilih kolom ID (Jika kolom ID tidak keluar, klik tanda plus dari Recordset (rsUser).

4. Klik OK sebanyak tiga kali untuk menyelesaikannya. Hasil dari langkah ini nantinya akan menghasilkan link http://localhost/hn/admin/edit-admin.php?delete=

5. Simpan kembali file admin.php

MEMBUAT REPEAT REGION DAN PAGING HALAMAN
Untuk membuat repeat region, cari kode di bawah ini (ubah dalam tampilan Code View), lalu blok kode berikut ini:
<tr>
<td width="50%"><?php echo $row_rsUser['name']; ?></td>
<td width="25%"><?php echo $row_rsUser['password']; ?></td>
<td width="25%"><a href="edit-admin.php?edit=<?php echo $row_rsUser['ID']; ?>">Edit</a> | <a href="edit-admin.php?delete=<?php echo $row_rsUser['ID']; ?>">Delete</a></td>
</tr>
Kemudian klik Insert > Data Objects > Repeat Region. pop up Repeat Region akan keluar. konfigurasinya:

Quote:Recordset: rsUser
Show: 5 Records at a time, ubah nilai 10 menjadi 5. (Ini artinya akan ditampilkan 5 data user/admin dalam satu halaman)

Klik OK untuk menyelesaikannya.

Langkah selanjutnya adalah membuat paging halaman untuk menampilkan data user jika ternyata user lebih dari 5 orang. Melalui Code View, cari kode dibawah ini:
<th colspan=”3″> </th>
Lalu hapus kode   tersebut dan biarkan kursor tetap di sana. Kemudian klik Insert > Data Objects > Recordset Paging > Recordset Navigation Bar, pop up Navigation Bar akan keluar. Lakukan beberapa konfigurasi di bawah ini:

Quote:Recordset: rsUser
Display using: Text

Klik OK untuk menyelesaikannya

istirahat dulu cuy,, Ngakak

BERSAMBUNG ..