Sebelum kita masuk ke pembahasan disini kita harus pahami tentang template yang akan kita buat...
Sofware yang dibutuhkan Photoshop + Dreamwever... Photoshop digunakan untuk merancang tampilan web yang akan di buat sedangankan dreamwever di gunakan untuk mengedit coding HTML maupun PHP dan MYSQL
Pertaman tama yang harus kita siapkan adalah rancangan web yang sudah kita buat dengan Photoshop seperti pada gambar ini
Langkah 1:
Dengan Slice tool potong tiap bagian tombol buat garis potongan sesuai keinginan kita.. misal potong bagian header, tombol dll seperti gambar ini
Langka 2:
Setelah semua selesai di slice selajutnya pilih Menu => File => Save for Web lalu
Pilih Save => pilih lokasi menyimpan => buat Folder Baru => Save pada folder baru tersebut beri nama index.html
Langkah 3:
Buka file yang disimpan tadi dengan Dreamwever seperti gambar ini
Langkah 4:
Pilih File => Save As sebanyak 3x (disesuaikan banyaknya tombol ) untuk membuat Link tiap tombol..
dalam contoh ini beri nama home.html,contac.html dam ilmukita.html
Klik Tombol home maka pada coding yang berwarna biru seperti ini
lalu buat link nya => klik Properties
Pada options Link => klik lambang folder => pilih file yang akan ditampilkan pada link ( sesuaikan dengan nama tombol, dalam hal ini di contohkan tombol home maka file yang di pilih home.html ) => OK
maka jika berhasil coding yang berwarna biru tadi akan berubah menjadi seperti ini
<td>
dalam kondisi seperti ini untuk link pada tombol sebenarnya dah jadi.
Kita bisa memodivikasi link tambol tadi dengan menambahkan target="_blank" agar setiap kita klik tombol tersebut maka link tersebut akan muncul pada tab baru/ new tab.
untuk tombol yang lain silahkan lanjutkan seperti langkah yang tadi sampai selesai...
Moga artikel ini dapat menambah ilmu baru bagi anda.. Selamat Mencoba
Sofware yang dibutuhkan Photoshop + Dreamwever... Photoshop digunakan untuk merancang tampilan web yang akan di buat sedangankan dreamwever di gunakan untuk mengedit coding HTML maupun PHP dan MYSQL
Pertaman tama yang harus kita siapkan adalah rancangan web yang sudah kita buat dengan Photoshop seperti pada gambar ini
Langkah 1:
Dengan Slice tool potong tiap bagian tombol buat garis potongan sesuai keinginan kita.. misal potong bagian header, tombol dll seperti gambar ini
Langka 2:
Setelah semua selesai di slice selajutnya pilih Menu => File => Save for Web lalu
Pilih Save => pilih lokasi menyimpan => buat Folder Baru => Save pada folder baru tersebut beri nama index.html
Buka file yang disimpan tadi dengan Dreamwever seperti gambar ini
Pilih File => Save As sebanyak 3x (disesuaikan banyaknya tombol ) untuk membuat Link tiap tombol..
dalam contoh ini beri nama home.html,contac.html dam ilmukita.html
Klik Tombol home maka pada coding yang berwarna biru seperti ini
<td>
< img
src="images/index_02.gif" width="214" height="64"
alt=""></a></td>
lalu buat link nya => klik Properties
Pada options Link => klik lambang folder => pilih file yang akan ditampilkan pada link ( sesuaikan dengan nama tombol, dalam hal ini di contohkan tombol home maka file yang di pilih home.html ) => OK
<td>
<a
href="home.html"><img src="images/index_02.gif"
width="214" height="64"
alt=""></a></td>
dalam kondisi seperti ini untuk link pada tombol sebenarnya dah jadi.
Kita bisa memodivikasi link tambol tadi dengan menambahkan target="_blank" agar setiap kita klik tombol tersebut maka link tersebut akan muncul pada tab baru/ new tab.
untuk tombol yang lain silahkan lanjutkan seperti langkah yang tadi sampai selesai...
Moga artikel ini dapat menambah ilmu baru bagi anda.. Selamat Mencoba
