TEMPLATE CUSTOM DENGAN DREAMWEAVER

Sahabat pembaca yang baik hatinya, izinkan saya berbagi tentang segenap pengetahuan tentang pembuatan template custom dari dreamweaver (bisa saja anda terapkan pada macromedia dreamweaver MX 2004 atau versi di atasnya misal : adobe dreamweaver versi XXX). Sebelumnya bagi sahabat sekalian yang sering mendesain layout web yang ditugaskan oleh Guru ataupun sebagai Pekerjaan Rumah, tentunya lebih memilih untuk mendesain sendiri atau secara custom dari pada download template yang tersedia gratis (free) di internet, dengan alasan :

1. Desain yang dibuat oleh tangan sendiri menjadi kenangan dan kebanggaan tersendiri meski hasil tidak menyerupai template gratisan.
2. Rasa percaya diri saat menjawab dan menerangkan layout template kepada teman, dosen atau penilai web yang anda buat (khususnya bagi mahasiswa ni)
3. Desain bebas untuk dikreasikan oleh creator template. Dan yang ke -
4. Semakin sering anda meng-custom semakin banyak anda berlatih dan bertambah ilmu desain anda meski pun autodidak.

Ok langsung saja, tanpa berbasa basi, pada kasus ini kita akan membuat sebuah layout template sederhana seperti gambar di bawah ini :

Catatan : Sebelumnya anda harus membuat site untuk web anda

1. Kerangka layout (perancangan)
   
   Anda desain terlebih dahulu tampilan dasar sesuai dengan kebutuhan anda, misalnya seperti ini :
   
2. Implementasi
   Jika rancangan sudah deal untuk di bangun, silahkan lakukan tahap desain langsung pada halaman kerja dreamweaver.
   • Pilih menu Insert kemudian pilih tabel dengan ketentuan rows = 4 dan cols = 2.
     
     
   • Lalu pilih Ok, dan hasilnya adalah tabel dengan jumlah baris 4 dan kolom 2, aturlah dengan teknik merge cell dan tentukan panjang serta lebar masing-masing baris sehingga bentuk desain tabel-nya seperti dibawah ini :
     
   • Desainlah header dan buatlah menu-menu yang diperlukan untuk navigasi halaman web dengan link yang cocok untuk memanggil halaman dituju.
     
3. Save as template
   Proses ke tiga adalah menyimpan layout untuk dijadikan template, dengan cara :
   • Pilih menu file => save as template, pilih site anda dan beri nama template anda misal : contoh_template, seperti dibawah ini :
     
     Lalu pilih update links, OK jika proses berhasil dilakukan, maka akan terbentuk folder baru dengan nama Templates yang berisi file contoh_template.dwt.php, hilangkan ekstensi php dengan cara klik kanan file contoh_template.dwt.php lalu rename dan hapus .php di belakangnya. Kemudian simpan kembali.
4. Membuat editable region
   (daerah layout yang dapat di isi (di edit) dengan konten sesuai dengan halaman web.)
   • Pilih tab layout pada lembar kerja => design kemudian pilih layout
   • Lalu seleksi atau klik daerah isi layout tepat pada tepi daerah yang ditandai dengan kotak-kotak kecil berwarna biru, pada contoh dibawah ini daerah diberi warnah gradient merah muda
   • kemudian klik kanan, pilih templates => klik neweditableregion => isi nama daerah : isi_layout
     Pilih ok dan daerah editable region sudah terbentuk
     
     Simpan kembali template anda.
5. Untuk membuat file turunan dari template yang sudah dibuat tadi, caranya pilih menu file=> new => pilih tab template => pilih site anda dan pilih create. Maka file turunan template berhasil dibuat dan simpanlah file tersebut. Untuk membuat link kehalaman-halaman yang anda bangun dari template ini, anda dapat memanipulasinya dari halaman template “contoh_template.dwt” yang terletak didalam folder Templates.
   Jika link sudah dihubungkan ke halaman yang dituju, simpan perubahan yang anda lakukan pada halaman “contoh_template.dwt”, pilih file => save kemudian pilih lagi menu file => pilih save all.
   

Kalau sahabat pembaca masih merasa bingung dengan tutorial ini, silahkan download contoh template disini Semoga Bermanfaat