Gambar 4.18 Window Tabel
Keterangan Pada Window Tabel :
A. Bagian Table Size
1. Rows : Bagian yang digunakan untuk menentukan jumlah baris tabel.
2. Columns : Bagian yang digunakan untuk menentukan jumlah kolom tabel.
3. Width : Bagian yang digunakan untuk menentukan ukuran lebar tabel.
dan satuan ukuran yang dipakai pixel atau persentase.
4. Border : Bagian yang digunakan untuk mengatur ketebalan border atau
batas tabel.
Ridzal Arif : Sistem Informasi Portal Akademik Pada SMA Swasta Eria Medan, 2009. USU Repository © 2009
5. Cell Padding : Bagian yang digunakan untuk mengatur jarak antara isi sel dengan batas isi sel.
6. Cell Spacing : Bagian yang digunakan untuk menentukan jarak antarsel dalam
tabel.
B. Bagian Header
Digunakan untuk memberikan keterangan teks pada bagian tabel sesuai dengan pilihan yang tersedia.
1. None : Tanpa menggunakan keterangan teks.
2. Left : Menampilkan keterangan teks pada kolom pertama atau pada
bagian sebelah kiri.
3. Top : Menampilkan keterangan teksa pada pertama atau pada bagian
sebelah atas.
4. Both : Menampilkan keterangan teks pada kolom dan baris pertama.
C. Bagian Accessbility
Kita dapat memberikan keterangan judul tabel pada kotak teks Caption. Sedangkan
untuk perataan teksnya kita dapat memilih dari daftar yang sudah disediakan pada
kotak daftar Align Caption.
Ridzal Arif : Sistem Informasi Portal Akademik Pada SMA Swasta Eria Medan, 2009. USU Repository © 2009
4.9.3 Jendela Perancangan Situs
Dalam perancangan situs, kita pasti akan disibukan dalam menangani scripting dan design web yang telah kita buat. Untuk itu di lembar kerja Macromedia Dreamwaver
MX 2004 ada 3 tabulasi jendela yang membantu kita dalam merancang situs yang kita buat..
1. Jendela Code : Pada jendela ini kita hanya bisa menuliskan teks scripting pemrograman web, baik itu HTML, JavaScripts, PHP dan lain-
lain . 2. Jendela Split : Pada Jendela ini Dreamweaver memberikan kemudahan bagi kita
dalam merancang situs, dengan membagi dua jendela pada lembar kerja yaitu Jendela Code dengan Jendela Design.
3. Jendela Design : Pada Jendela ini kita hanya bisa merancang situs tanpa bisa menuliskan scripting pemrograman web. Pada jendela design kita
bisa menuliskan teks, menampilkan images, dan lain-lain. Apa yang kita buat di jendela design maka itulah yang akan kita lihat
pada browsingnya atau yang dikenal dengan istilah WYSIWYG What You See Is What You Get.
4.9.4 Halaman Situs
Pada jendela halaman utama atau yang sering juga dinamakan dengan file index memiliki 4 buah link. Link adalah suatu teks atau gambar yang dipakai dalam
Ridzal Arif : Sistem Informasi Portal Akademik Pada SMA Swasta Eria Medan, 2009. USU Repository © 2009
dokumen HTML untuk melompat dari satu dokumen ke dokumen atau ketempat lain pada dokumen yang sama. Kita dapat menggunakan teks images yang ada didalam
halaman Web dan juga dapat membuat teks khusus untuk digunakan sebagai link.
Untuk membuat link pada Dreamweaver MX 2004 dapat diikuti cara berikut :
1. Tempatkan kursor pada tempat kerja atau images yang ingin kita jadikan link.
2. Kemudian pada Properti Inspector pilih link dan pilih file yang ingin kita
jadikan tempat tujuan dengan mengklik icon berbentuk folder.
Berikut ini adalah contoh halaman index yang ditampilkan pada browser Internet Explorer.
Gambar 4.19 Halaman Visi dan Misi Pada Situs
Ridzal Arif : Sistem Informasi Portal Akademik Pada SMA Swasta Eria Medan, 2009. USU Repository © 2009
4.9.5 Penggabungan Scripts Dengan Layout Situs
Mungkin karena kemudahan serta kecanggihan editor ini, membuatnya lebih banyak dipakai oleh para web desaigner dan web programming. Salah satu kemudahan yang
dimiliki oleh Dreamweaver MX 2004 adalah dapat menggabungkan script program pada layout halaman situs. Penggabungan antara script pemrograman web dengan
halaman situs seperti JavaScripts, PHP dan lain-lain dapat dengan menuliskan
langsung scriptsnya pada tempat yang telah kita tentukan pada jendela Code atau pada jendela Split, atau dengan memanggil nama filenya saja yang terletak dalam satu
dokumen. Dan ini hanya bisa dilakukan hanya untuk pemrograman Server Side seperti PHP.
Untuk memanggil file PHP mis : photo.php untuk ditempatkan pada halaman situs, cukup dengan cara :
1. Tempatkan kursor pada tempat yang telah kita tentukan.
2. Pada Jendela Split, beralihlah pada bagian Code kemudian ketikkan ? include „photo.php‟ ?.
4.9.6 Membuat Pop-Up Menu
Pop-Up Menu digunakan untuk membuat sebuah menu dengan banyak pilihan link yang langsung dapat diakses oleh pengunjung. Pop-Up Menu tidak memakan banyak
tempat dan dapat dibuat bertingkat sehingga kita tidak perlu bingung untuk
Ridzal Arif : Sistem Informasi Portal Akademik Pada SMA Swasta Eria Medan, 2009. USU Repository © 2009
menempatkan menu ini. Kita dapat menggunakan teks atau gambar image sebagai sarana untuk membuat menu ini.
Sebelum kita membuat pop-up menu, ada baiknya kita persiapkan teks atau images sebagai penghubung pop-up menu. Dibawah ini adalah contoh gambar image
sebagai penghubung pop-up menu:
Gambar 4.20 Gambar Sebagai Link Penghubung Pop-Up Menu
Adapun cara membuat pop-up menu pada Dreamweaver MX 2004 adalah sebagai berikut :
1. Pilih gambar yang dijadikan penghubung pop-up menu. Misalnya PROFIL 2. Pilih menu Window pilih Behaviors dan aktifkan panel Behaviors atau dapat
juga digunakan dengan menekan kombinasi tombol Ctrl + F3. 3. Klik tanda pada panel Behaviors, kemudian pilih submenu Show Pop-
Up Menu pada tampilan yang ada sehingga muncul tampilan kotak dialog Show Pop-Up Menu seperti dibawah ini:
Ridzal Arif : Sistem Informasi Portal Akademik Pada SMA Swasta Eria Medan, 2009. USU Repository © 2009
Gambar 4.21 Window Content Show Pop-Up Menu
4. Pastikan kalau kita sudah berada pada tabulasi Contents. Pada bagian ini, isi
