Membuat website dengan dreamweaver

download Membuat website dengan dreamweaver

of 12

  • date post

    16-Aug-2015
  • Category

    Documents

  • view

    44
  • download

    0

Embed Size (px)

Transcript of Membuat website dengan dreamweaver

  1. 1. By M.Sofi Asrifin www.bebiy.com Membuat Website Dengan Dreamweaver CS3 untuk membuat website dengan Dreamweaver CS3 ada hal-hal yang perlu dipersiapkan yaitu : 1. Software XAMPP. Softwarenya dapat di download disini 2. Adobe Dreamweaver CS3. Softwarenya dapat di download disini Selanjutnya kita akan membuat web kita agar dalam satu folder dan dapat dicoba di komputer lokal. Dan yang perlu di ingat yaitu buat foldernya harus di instalasi XAMPP yaitu di Local Disk C xampp htdocs. Berikut ini langkah-langkahnya : 1. Pilih menu site New Site seperti pada gb1 gb 1 2. Kemudian akan tampil kotak dialog Site Definition For berikut
  2. 2. By M.Sofi Asrifin www.bebiy.com Pada kotak What would you like to name your site? isikan nama websitemu dan kotak di bawahnya isikan alamat http://localhost/bebiy karena kita moncoba di server lokal. Kemudian klik tombol Next 3. Selanjutnya Pilih Yes, I want to use a server technology dan pada Which server technology pilih yang PHP MySQL karena tutorial ini akan menggunakan pemrograman PHP dan MySQL. Klik Next Gb 3 4. Pilih Edit locally, then upload to remote testing server dan letakkan folder tempat untuk menyimpan file website kita di drive C:xampphtdocsbebiy
  3. 3. By M.Sofi Asrifin www.bebiy.com 5. Pilih nama folder yang sudah kita buat klik Next 6. Pada kotak ketikkan alamat http://localhost/bebiy. nama bebiy disesuaikan dengan nama folder yang anda buat dari awal tadi. Klik Test URL
  4. 4. By M.Sofi Asrifin www.bebiy.com 7. Jika berhasil akan muncul pesan seperti ini :
  5. 5. By M.Sofi Asrifin www.bebiy.com DESAIN TAMPILAN WEBSITE Sebelum membuat website terlebih dahulu kita akan membuat tampilan layout websitenya. Secara default tampilan sebuah website terdiri dari Header, Menu, Isi, Footer. Berikut ini cara membuat layout website menggunakan tabel 1. Buatlah sebuah tabel caranya pilih menu Insert > Tabel 2. Pada kotak dialog tabel pada bagian rows isikan 3, column isikan 2, tabel width 100% seperti gambar dibawah ini 3. Jika sudah selesai pilih OK 4. Blok pada baris 1 kolom 1 dan 2, Klik Kanan Merge Cells. Lakukan hal yang sama pada baris 3 kolom 3 dan 2 5. Hasil layoutnya akan seperti ini 6. Pada bagian header dapat dimasukkan gambar dengan cara pilih menu Insert Image 7. Pada bagian menu buat menu home, about, bukutamu
  6. 6. By M.Sofi Asrifin www.bebiy.com MEMBUAT HALAMAN BUKU TAMU 1. Buat form caranya pilih menu Insert -> Form -> Form 2. Membuat Tabel dengan 4 baris 3 kolom 3. Kemudian isikan tiap baris pada tabelnya seperti ini 4. Untuk membuat kotak isian nama dan email buat Text Field pada menu insert, Untuk kotak isian komentar pilih Text Area, dan untuk membuat tombol submit pilih Insert -> Fom -> Button dan jangan lupa setiap kotak isian dari nama, email, komentar dan tombol submit masing-masing diberi nama.
  7. 7. By M.Sofi Asrifin www.bebiy.com MEMBUAT DATABASE DI phpMyAdmin Agar ketika kita mengisi form bukutamu hasil isiannya dapat disimpan didalam database maka kita harus membuat databasenya dulu di phpmyadmin. Berikut ini caranya membuat database di phpmyadmin 1. Buka browser dan ketikkan alamat http://localhost/phpmyadmin 2. Buat database baru dengan nama bukutamu seperti gambar berikut, lalu klik Ciptakan 3. Buat tabel yang berada dalam database bukutamu, kemudian buat tabel bukutamu dengan nama tbbukutamu dengan 4 field, lalu klik Go 4. Isilah tabel yang sudah dibuat tadi seperti ini Jangan lupa pada field id pada bagian AI/Auto Inrement kamu beri tanda centang agar setiap kali mengisi bukutamu no urutnya terbentuk secara otomatis.
  8. 8. By M.Sofi Asrifin www.bebiy.com 5. Jika langkah diatas berhasil maka tampilannya akan seperti ini Jika ingin mengedit field dapat di pilih gambar pensil, kalau ingin mengapus pilih gambar sebelahnya gambar pensil
  9. 9. By M.Sofi Asrifin www.bebiy.com MEMBUAT KONEKSI PHP KE DATABASE 1. Buka file bukutamuyangsudahdibuat 2. PilihWindows Database 3. Pilihpadagambar yang bertanda + MySQL Connection. 4. Akanmuncul kotakdialogMySQL Connectionsepertigambardibawahini Isikankotakdialogseperti ini Connectionname :kamuisi nama koneksinyapadaconohini saya beri namakoneksi MySQL server : isikanlocalhost Username : root Password : kamu kosongkoan saja Database :pilihtombol selectuntukmemili databaseyangsudahkamubuat sebelumnyadi phpMyadmin 5. Langkah selanjutnyapilih Windows Database ServerBehavior 6. Pilihpadagambar yang bertanda + PilihInsertRecord. 7. Kemudianakanmuncul kotak dialogInsertRecordseperti ini
  10. 10. By M.Sofi Asrifin www.bebiy.com Pada submitvaluesfrom:pilihform1 Connection : pilihkoneksi (sesuaikandengannamayangsudahdibuatdi MySQL Connection InsertTable : pilihtbbukutamu(namanyasesuaikandengannamatabel yang beradadi database phpMyAdmin Columns : samakandengandenganyangada di gambar jikaada tulisan Not Get Value Formberarti beberapaformkamuada yang belumdikasih nama.