<---A 7 1 P--->

Melindungi halaman admin dengan Username dan Password

1. Buka file admin.php dengan Dreamweaver Anda
2. Klik Insert > Data Objects > User Authentication > Restric Access To Page. Jendela ini akan keluar, lakukan beberapa setingan berikut ini
3. Restric based on: Username and Password
4. If access denied, go to: login.php. Klik Browse lalu pilih file login.php. Ini artinya ketika halaman admin.php ingin Anda buka dan Anda belum melakukan login dengan username dan password yang benar, maka Anda akan dialihkan ke halaman login.php.
5. Klik  OK untuk menyelesaikannya. Lalu simpan hasil pekerjaan Anda

Menambahkan dan mengaktifkan link Log Out

1. Buka file admin.php 
2. Cari dan seleksi (blok) tulisan Log Out yang berada di sudut kiri bawah sidebar  halaman website Anda. Gunakan Design View untuk melakukannya. Di sana Anda akan menemukan tulisan Log Out dengan gambar merah beserta link berisi tanda kres (#).
3. Klik Insert > Data Objects > User Authentication > Log Out User. Jendela Log Out User akan keluar lalu lakukan konfigurasi.
4. Log Out when: Link Clicked
5. When done, go to: login.php. Klik Browse lalu cari file login.php, ini artinya ketika proses Log Out berhasil dilakukan Anda akan dialihkan ke halaman login.php
6. Klik OK untuk menyelesaiaknnya. Simpan kembali file Anda.

Membuat halaman login (login.php)

• Membuat form login
• Mengaktifkan form login

Membuat form login:

1. Buka halaman login.php melalui Dreamweaver Anda.
2. Di sana Anda akan menemukan tulisan “Form login di sini”. Hapus tulisan tersebut, di sana Anda akan membuat form login tersebut
3. Klik Insert > Form > Form
4. Klik Insert > Spry > Spry Validation Text Field. Jendela Input Tag akan muncul, lalu isi dengan data berikut ini.
5. ID: username, lalu Label: Username:<br>. Lalu klik OK. Letakkan kursor Anda setelah text field, lalu tekan ENTER
6. Klik Insert > Spry > Spry Validation Password. Jendela Input Tag akan keluar. Lakukan konfigurasi berikut ini
7. ID: password, lalu Label: Password:<br>. Klik OK, letakkan kursor Anda setelah password field, tekan ENTER
8. Klik Insert > Form > Button
9. ID: submit, biarkan Label-nya kosong. Klik OK
10. Klik tombol Submit tersebut, lalu Copy, letakkan kursor Anda di samping kanan dari tombol tersebut, lalu Paste
11. Klik tombol Submit yang baru saja Anda Paste tadi, lalu melalui panel Properties ubah menjadi Reset form
12. Simpan kembali hasil pekerjaan Anda.
13. Mengaktifkan form login

Mengaktifkan form login

1. Pastikan file login.php masih Anda buka
2. Klik Insert > Data Objects > User Authentication > Log In User. Jendela Log In User akan muncul. Lakukan konfigurasi seperti di bawah ini.
3. Get input from form: form1
4. Username field: username
5. Password field: password
6. Validate using connection: cms_blog, klik pop-up menu untuk memilihnya
7. Table: users
8. Username column: username
9. Password column: password
10. If login succeds, go to: index.php, ini artinya jika proses login Anda sukses dan benar, maka Anda akan dialihkan ke halaman index.php. Anda dapat mengklik Browse untuk mencari file index.php
11. Beri tanda checked/centang pada pilihan Go to previous URL (If exists)
12. If login fails, go to: login.php. Ini artinya ketika proses login Anda mengalami kegagalan, Anda akan dikembalikan ke halaman login.
13. Klik OK untuk menyelesaiakannya. Simpan  kembali pekerjaan Anda.
14. Halaman login telah berhasil Anda selesaikan. Jika muncul jendela peringantan Copy Dependent File, klik OK saja

Membuat form tambah berita dan mengaktifkannya (add-news.php)

• Menampilkan data login, sehingga nantinya siapa yang melakukan posting dan edit berita akan terekam secara otomatis
• Membuat form tambah berita
• Mengaktifkan form tambah berita

1. Buka file add-news.php
2. Klik Insert > Data Objects > Recordset. Jendela Recordset akan muncul
3. Name: rsSession (ubahlah defaultnya yang semula Recordset1 menjadi rsSession)
4. Connection: cms_blog
5. Table: users
6. Columns: All
7. Filter: username
8. Ubah URL Parameter menjadi Session Variable
9. Ubah tulisan username menjadi MM_Username (perhatikan besar kecil huruf)
10. Klik OK untuk menyelesaikannya.
11. Simpan kembali hasil pekerjaan Anda.

1. Membuat Site Definition di Dreamweaver CS5, dan
2. Membuat koneksi database PHP MySQL dengan Dreamweaver CS5
3. Membuat CMS PHP MySQL Menggunakan Dreamweaver CS5, CS4, CS3 (Part 1)

Membuat form edit data administrator

1. Buka file edit-admin.php dengan Dreamweaver Anda
2. Hapus tulisan “Form edit-admin goes here”
3. Klik Insert > Data Objects > Recordset. Jendela Recordset akan muncul. Lalu lakukan perubahan seperti di bawah ini:
4. Name: Recordset1. Lalu Connection: cms_blog, Table: users
5. Pada menu Filter, pilih ID. Lalu tulisan ID menjadi edit
6. Klik OK untuk menyelesaikannya. (Lihat Gambar di atas)

1. Klik Insert > Data Objects > Update Record > Record Update Form Wizard. Jendela Record Update Form akan keluar. Lakukan beberapa perubahan.
2. Connection: cms_blog
3. Table to update: users
4. Select record from: Recordset1
5. Unique key column: ID, dengan Numeric bertanda centang/checked
6. After updating, go to: admin.php. Anda bisa mengklik Browse lalu pilih file admin.php
7. Pada menu Form fields:, seleksi kolom ID lalu hapus dengan mengklik tanda minus (-) di atasnya, yang artinya Remove item. Lakukan hal yang sama untuk kolom updated. Hapus juga kolom tersebut karena isinya (ID dan updated) akan digenerate secara otomatis oleh MySQL. Ini artinya yang tersisa
8. Klik kolom password, lalu pada menu Display as: secara default adalah Text field. Ubahlah menjadi Password field. Secara otomatis Default value: akan berubah menjadi kosong.
9. Untuk memasukkan Default Value, klik gambar petir maka jendela Dynamic Data akan keluar. Klik tanda plus (+) pada Recordset (Recordset1) lalu pilih kolom password lalu Klik OK. Anda juga dapat mengetik Default Value secara manual dengan menambahkan kode ini: <?php echo $row_Recordset1['password']; ?>
10. Klik OK untuk menyelesaikannya. Form Edit data Admin Anda telah selesai
11. Simpan hasil pekerjaan Anda

Menghapus data admin

1. Pastikan Anda masih membuka halaman edit-admin.php
2. Klik Insert > Data Objects > Delete Record. Jendela Delete Record akan keluar.
3. Check if variable is defined: Primary key value
4. Connection: cms_blog
5. Table: users, ubah dengan mengklik pop-up menu
6. Primary key column: ID, dengan Numeric bertanda centang/checked
7. Primary key value: URL Parameter. Lalu ubah tulisan ID menjadi delete
8. After deleting, go to: admin.php. Anda dapat mengklik Browse lalu klik file admin.php.
9. Klik OK untuk menyelesaikannya
10. Simpan kembali pekerjaan Anda.

1. Membuat Site Definition di Dreamweaver CS5, dan
2. Membuat koneksi database PHP MySQL dengan Dreamweaver CS5
3. Mendownload source code cms_blog.rar dan mengesktraktnya ke dalam webroot komputer Anda

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 ;

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 ;

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 ;

1. Buka file add-admin.php
2. Ubah tulisan “Edit admin” menjadi “Add admin”
3. Kemudian hapus tulisan “Form add-admin goes here”, di sana Anda akan membuat form tambah Admin
4. Klik Insert > Data Objects > Insert Record > Record Insertion Form Wizard. Jendela baru akan muncul, lakukan beberapa konfigurasi seperti di bawah ini.
5. Connection: cms_blog, bisa jadi berbeda dengan Anda (tergantung penamaan koneksi pada saat Anda membuat koneksi database PHP MySQL)
6. Table: users
7. After inserting, go to: admin.php, Anda juga bisa mengklik Browse untuk mencari file admin.php
8. Pada menu Form fields Anda akan melihat tanda plus (+), yang artinya Add item dan minus (-) yang artinya Remove item. Di sana Anda juga akan melihat menu Column, Label, Display As dan Submit As. Column adalah kolom yang ada di dalam tabel MySQL Anda, dalam hal ini tentunya tabel users.
9. Pada menu Column, klik kolom ID, lalu klik tanda minus (-). Lakukan hal yang sama pada kolom updated. Ini artinya, yang tersisa hanya kolom name,
   username dan password. Selanjutnya Anda akan merubah menu Display As kolom password, sehingga yang semula berupa text field berubah menjadi password field
10. Klik pada kolom password, lalu pada menu bagian bawah, Anda akan melihat menu Display As:, klik pop-up menu yang ada, lalu ubah menjadi Password field
11. Klik OK jika sudah selesai, form Anda akan muncul pada design view
12. Klik Split View, lakukan perubahan/penambahan kode dengan tangan Anda. Cari kode <table align=”center”> lalu ubah menjadi <table align=”center” class=”data-table”>. Lakukan juga perubahan pada button, cari kode berikut <input type=”submit” value=”Insert record”> lalu ubah value-nya menjadi <input type=”submit” value=”Add admin”>
13. 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”>
14. Sekarang Anda mempunyai dua buah button, yang satu untuk Add admin dan yang satunya adalah tombol Reset
15. Simpan kembali file add-admin.php, cobalah melalui browser. Anda telah berhasil membuat dan mengaktifkan form tersebut.
16. Lakukan ujicoba memasukkan bebeberapa nama, username dan password. Setiap kali selesai menambahkan nama, username dan password, Anda akan dialihkan ke halaman admin.php

1. Buka file admin.php, bukalah dengan Design View
2. Untuk menyamakan persepsi, kita sama workspace terlebih dahulu. 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:
4. Name: rsUser, penamaan recordset/query di sini adalah bebas, Anda diijinkan untuk memberi nama yang berbeda
5. Connection: cms_blog
6. Table: users
7. Sort: name. Klik pop-up menu pertama, lalu pilih kolom name, lalu pada pop-up menu kedua, biarkan nilai ASCENDING tetap seperti semula. Ini artinya Anda akan mengurutkan namanya berdasarkan abjad.
8. Klik Test untuk mengetes query Anda, jika Anda telah memasukkan data user/admin sebelumnya, maka Anda akan melihat nama user diurutkan berdasarkan abjad. Klik OK untuk menutup jendela Test
9. Klik OK sekali lagi. Anda telah berhasil membuat query. Pada menu Bindings, Anda akan melihat Recordset (rsUser) telah muncul.
10. Klik icon/tanda plus (yang berada dalam jendela Recordset (rsUser) yang berbackground putih. Di sana Anda akan melihat kolom tabel user secara detail yang terdiri atas ID, name, username, password, dan updated
11. Cari tulisan “Name & username go here”, lalu hapus tulisan tersebut. Di sana Anda akan mengisinya dengan dynamic data yang telah Anda simpan dalam tabel user.
12. Melalui panel/menu Bindings dan Recordset (rsUser), klik kolom tabel name, lalu drag/tarik/seret menuju teks yang telah Anda hapus (Langkah 11)
13. Lalu cari tulisan “2001-10-22 09:00″, kemudian hapus
14. Melalui panel/menu Bindings dan Recordset (rsUser), klik kolom tabel password, lalu drag/tarik/seret menuju teks yang telah Anda hapus (Langkah 13)
15. Seleksi tulisan “Edit”, lalu klik kanan > Make link kemudian jendela Select File akan muncul. Buka folder admin, lalu klik file edit-admin.php
16. 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
17. Pada kolom Name, ketik edit, lalu klik pada kolom Value, sejajar dengan tulisan edit. Anda akan diminta untuk mengisinya, klik icon/tanda petir/listrik 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).
18. Klik OK sebanyak tiga kali untuk menyelesaikannya. Hasil dari langkah ini nantinya akan menghasilkan link http://localhost/cms_blog/admin/edit-admin.php?edit=1
19. Seleksi tulisan “Delete”, lalu klik kanan > Make link kemudian jendela Select File akan muncul. Buka folder admin, lalu klik file edit-admin.php
20. 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
21. Pada kolom Name, ketik delete, lalu klik pada kolom Value, sejajar dengan tulisan delete. Anda akan diminta untuk mengisinya, klik icon/tanda petir/listrik 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).
22. Klik OK sebanyak tiga kali untuk menyelesaikannya. Hasil dari langkah ini nantinya akan menghasilkan link http://localhost/cms_blog/admin/edit-admin.php?delete=1
23. Simpan kembali file admin.php

<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>

• 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

• Recordset: rsUser
• Display using: Text
• Klik OK untuk menyelesaikannya

Membuat CMS PHP MySQL Menggunakan Dreamweaver CS5, CS4, CS3 (Part 1)