Professional Documents
Culture Documents
Web Component
322
http://www.SmartOnlineSchool.com
" Sekolah Khusus Netter Indonesia "
Sebenarnya pada bab yang lalu kita telah menggunakan Web Component, yaitu
gambar terjadwal dan sarana untuk menghasilkan animasi. Antara lain Picture
Scheduled, Marquee, Banner Ad Manager dan Hover Button. Pada bab 11 ini akan
dibahas beberapa Web Component yang disediakan oleh FrontPage XP. Dimulai
dengan Search yaitu sarana pencari.
323
http://www.SmartOnlineSchool.com
" Sekolah Khusus Netter Indonesia "
5. Pada kotak isian Label for input tuliskan label pencarian, misalnya “Yang
dicari: ”.
6. Pada kotak isian Width in characters tentukan panjang karakter yang diijinkan.
Defaultnya 20, ini suadh cukup panjang.
324
http://www.SmartOnlineSchool.com
" Sekolah Khusus Netter Indonesia "
Gambar 11.3 Tab Search Result
10. Kotak isian Word list to search terpampang isian All. Hal ini berarti akan
mencari keseluruhan kata yang Anda tuliskan secara persis.
11. Kotak pilihan Date format, untuk menentukan format penulisan tanggal. Kotak
ini bisa digunakan apabila Anda mengaktifkan kotak cek Display file date.
12. Kotak pilihan Time format, untuk menentukan format penulisan waktu. Kotak
ini bisa digunakan apabila Anda mengaktifkan kotak cek Display file date.
13. Kotak cek Display score , untuk menampilkan angka mutu proses pencarian.
14. Kotak cek Display file date, untuk menampilkan tanggal daan waktu pencarian.
Jika Anda aktifkan pilihan ini maka kotak isian Date format dan Time format
akan aktif sehingga Anda bisa memilih format penulisan tanggal dan waktu.
15. Kotak cek Display file size , untuk menampilkan ukuran file dalam satuan K
Byte.
16. Klik OK. Hasilnya seperti Gambar 11.4.
325
http://www.SmartOnlineSchool.com
" Sekolah Khusus Netter Indonesia "
Gambar 11.4 Hasil pemasangan sarana pencari
326
http://www.SmartOnlineSchool.com
" Sekolah Khusus Netter Indonesia "
9. Kemudian klik tab Search Results. Lihat Gambar 11.5.
327
http://www.SmartOnlineSchool.com
" Sekolah Khusus Netter Indonesia "
Gambar 11.6 Kotak dialog Current Web
11. Kotak isian Maximum records per page , untuk menentukan jumlah record
yang akan ditampilkan pada halaman. Pencarian bisa saja menemukan banyak
sekali halaman. Lalu Anda bisa menentukan jumlah halaman yang akan
ditampilkan. Tampilan berupa tabel dan satu baris disebut dengan satu record.
Anda bisa mengatur agar menampilkan sampai 1000 record. Selanjutnya, untuk
menampilkan isi halaman, klik salah satu record di dalam tabel yang Anda
inginkan.
12. Kotak isian Maximum records per query, untuk menentukan kapasitas
pencarian.
13. Kotak cek Last time file was changed, untuk menampilkan tanggal daan waktu
perubahan terakhir pada file.
14. Kotak cek Size in bytes, untuk menampilkan ukuran file dalam satuan Byte.
15. Kotak cek Score (Closeness of match), untuk menampilkan tingkat ketepatan
antara kata yang dicari dengan file hasil pencarian.
16. Kotak cek Author of doccument untuk menampilkan nama pembuat dokumen.
17. Kotak cek Cuments untuk menampilkan komentar yang ada.
18. Kotak cek Documents Subject untuk menampilkan topik isi dokumen.
19. Kotak cek Matches untuk menampilkan tingkat kesesuaian.
20. Klik OK. Hasilnya sama dengan yang dihasilkan oleh Windows 98, yaitu seperti
Gambar 11.4.
328
http://www.SmartOnlineSchool.com
" Sekolah Khusus Netter Indonesia "
1.3 Mencoba pada browser
Setelah sarana pencari terpasang di halaman, selanjutnya Anda bisa mencobanya
pada browser.
Ada hal yang perlu Anda perhatikan, jika situs yang Anda buat adalah Disk based
web (tidak di dalam folder Inetpub\wwwroot) maka Anda harus mem-publish situs
web Anda lebih dulu.
Publish adalah proses pemasangan folder situs ke folder web yang ada di direktori
Inetpub\wwwroot. Langkah yang diperlukan adalah dengan mengaktifkan perintah
File _ Publish web, lalu mengisikan nama folder web tujuan (jika belum ada, Anda
bisa membuatnya saat itu juga). Untuk keterangan lebih detil tentang publish atau
publikasi ini, simaklah bab terakhir. Ada cara mempublish yang amat sederhana,
yaitu salinlah folder tersebut ke folder Inetpub\wwwroot.
Setelah dipublish, lalu jalankan browser dan bukalah alamat web tersebut.
Jika langkah di atas tidak Anda lakukan, misalnya Anda memilih untuk langsung
menampilkan situs dengan tombol Preview in browser tanpa mem-publish lebih
dulu, maka Anda akan mendapatkan halaman error seperti Gambar 11.7 berikut ini:
329
http://www.SmartOnlineSchool.com
" Sekolah Khusus Netter Indonesia "
klik tombol Mulai. Sesaat kemudian FrontPage XP akan mulai mencari file tersebut.
Jika ditemukan, hasilnya akan seperti Gambar 11.8.
330
http://www.SmartOnlineSchool.com
" Sekolah Khusus Netter Indonesia "
Gambar 11.9 Hasil pencarian home pada lingkungan Windows 2000
331
http://www.SmartOnlineSchool.com
" Sekolah Khusus Netter Indonesia "
1.5 Error sarana pencari
Ada beberapa error yang umum dijumpai pada pemakaian sarana pencari ini. Error
tersebut muncul jika Anda tidak menjalankan prosedur. Misalnya error seperti
Gambar 11.10 berikut ini yang muncul karena Anda tidak mem-publish web Anda.
332
http://www.SmartOnlineSchool.com
" Sekolah Khusus Netter Indonesia "
Gambar 11.12 Tampilan Control Panel
2. Klik ganda icon Administrative Tools , muncul tampilan seperti Gambar 11.13.
333
http://www.SmartOnlineSchool.com
" Sekolah Khusus Netter Indonesia "
4. Tampilkan icon Indexing Service. Gunakan scroll vertikal di sebelah kanan
tampilan tersebut.
5. Setelah menemukan icon Indexing Service, klik ganda icon tersebut. Muncul
kotak dialog Indexing Service Properties.
334
http://www.SmartOnlineSchool.com
" Sekolah Khusus Netter Indonesia "
Gambar 11.17 Indexing Service sudah aktif
Jalankan lagi sarana pencari Anda, kali ini pasti akan berhasil, sebab Indexing
Service sudah diaktifkan.
335
http://www.SmartOnlineSchool.com
" Sekolah Khusus Netter Indonesia "
3. Klik ganda icon Search Page. Terbentuk sebuah halaman yang mengandung
sebuah sarana pencari. Gambar 11.19.
2 Hit Counter
Web Component yang satu ini sering dijumpai di situs-situs yang ada di internet.
Gunanya untuk menghitung jumlah pengakses situs yang bersangkutan. Jumlah ini
mencerminkan popularitas situs tersebut.
Langkah pemasangan hit counters, mudah sekali, yaitu:
1. Tentukan lokasi pemasangan hit counters pada halaman.
2. Aktifkan Insert _ Web Component. Muncul kotak dialog Insert Web
Component. Lihat Gambar 11.20.
336
http://www.SmartOnlineSchool.com
" Sekolah Khusus Netter Indonesia "
Gambar 11.20 Kotak dialog Insert Web Component
3. Pada bidang kiri, klik Hit Counter. Pada bidang kanan muncul pilihan jenis
hit counter.
4. Pada bidang kanan, klik salah satu model hit counter yang Anda sukai.
5. Klik tombol Finish, muncul kotak dialog Hit Counter Properties.
337
http://www.SmartOnlineSchool.com
" Sekolah Khusus Netter Indonesia "
digunakan (Fixed number of digits ). Cara mengaturnya: klik kotak cek
yang Anda inginkan lalu isikan angka yang Anda inginkan pada kotak isian
yang telah disediakan. Untuk Reset counter to misalnya 0 (nol). Dan untuk
Fixed number of digits misalnya 5.
7. Klik OK, hit counter muncul di halaman. Lihat Gambar 11.22.
338
http://www.SmartOnlineSchool.com
" Sekolah Khusus Netter Indonesia "
3 Photo Gallery
Photo Gallery adalah fasilitas baru yang ada di FrontPage XP. Photo Gallery
menyediakan sarana pembuatan halaman yang bisa digunakan untuk menampilkan
foto-foto dengan berbagai kompos isi yang menarik. Sebelum membuatnya, Anda
harus telah menyiapkan berbagai file foto di dalam situs Anda. Sebaiknya file -file
tersebut Anda simpan di dalam situs Anda, akan lebi baik pada folder khusus
misalnya images.
Mudah sekali cara pembuatan Photo Gallery, yaitu hanya perlu dua langkah seperti
berikut ini:
1. Salinlah file -file foto yang hendak ditampilkan pada folder images di dalam
situs Anda.
2. Kemudian buatlah sebuah halaman baru, lalu aktifkan Insert _ Web
Component. Muncul kotak dialog Insert Web Component.
Gambar 11.24 Pilihan Photo Gallery pada kotak dialog Insert Web Component
3. Pada bidang kiri kotak dialog tersebut klik pilihan Photo Gallery, lalu pada
bidang kanan klik salah satu komposisi yang Anda inginkan.
4. Klik tombol Finish, muncul kotak dialog Photo Gallery Properties, yang bisa
kita gunakan untuk pemilihan gambar yang akan kita gunakan. Gambar 11.25.
339
http://www.SmartOnlineSchool.com
" Sekolah Khusus Netter Indonesia "
Gambar 11.25 Kotak dialog Photo Gallery Properties
5. Klik tombol Add, muncul dua pilihan Pictures from files dan Pictures from
scanners. Karena Anda telah memiliki berbagai file foto, pilihlah yang pertama
(Pictures from files). Namun masih tidak tertutup kemungkinan untuk
mengambil foto dari scanner, tujuan ini bisa Anda capai dengan klik pilihan
kedua (Pictures from scanners). Untuk klik pilihan pertama, akan muncul
kotak dialog File Open (Gambar 11.26) untuk memilih file gambar. Gunakan
kotak dialog tersebut untuk memilih gambar-gambar yang tersimpan di folder
images di dalam situs Anda.
340
http://www.SmartOnlineSchool.com
" Sekolah Khusus Netter Indonesia "
6. Ulangi langkah nomor 5 di atas sampai seluruh gambar yang Anda inginkan
terpilih. Nama gambar akan ditampilkan dalam bentuk daftar di kotak dialog
Photo Gallery. Kalau Anda klik salah satunya, gambarnya akan ditampilkan di
bidang sebelah kanan. Jumlah gambar yang terpilih akan ditampilkan juga pada
kotak dialog ini. Pada contoh ini ada 11 gambar, maka muncul kalimat You
have 11 pictures in this gallery.
341
http://www.SmartOnlineSchool.com
" Sekolah Khusus Netter Indonesia "
masing-masing gambar. Caranya, klik nama gambar lalu pada Thumbnail size ,
tentukan ukuran lebar (Width) dan tinggi (Height) dengan klik tombol spin di
sebelahnya. Klik tombol ke atas akan menaikkan ukuran dan sebaliknya. Satuan
ukuran yang digunakan aadalah pixel. Selanjutnya Anda bisa membuat ukuran
thumbnail dengan perbandingan lebar X tinggi sesuai dengan perbadingan
gambar aslinya, yaitu dengan mengaktifkan kotak cek Maintain aspect ratio.
Kalau Anda menyukai perbandingan tertentu dan ingin menerapkan ukran
favorit ini ke seluruh gambar, klik saja kotak cek Set as default size .
11. Meskipun Anda telah menentukan jenis komposisi pada kotak dialog Web
Component (Gambar 11.24) yang kini telah tertutup, Anda masih bisa memilih
komposisi dengan kotak dialog Photo Gallery Properties. Yaitu klik tab
Layout, muncul pilihan komposisi seperti Gambar 11.28.
12. Pada bidang kiri (Choose a layout), pilihlah komposisi lain. Hasil sementara
pilihan Anda akan ditampilkan pada bidang kanan (Preview).
13. Kalau seluruh pengaturan yang Anda inginkan sudah tercapai, Anda bisa klik
tombol OK. Maka hasilnya akan seperti Gambar 11.29.
342
http://www.SmartOnlineSchool.com
" Sekolah Khusus Netter Indonesia "
Gambar 11.29 Contoh pemasangan photo gallery
Kalau Anda jalankan pada browser, tampilan akan seperti Gambar 11.30.
343
http://www.SmartOnlineSchool.com
" Sekolah Khusus Netter Indonesia "
4 Include Content
Masih banyak koleksi Web Component yang bisa Anda gunakan. Berikut ini akan
dibahas satu kelompok lagi, bernama Include Content yang di dalamnya terdapat
empat jenis web component je nis include, antara lain Substitution, Pages, Page
Based On Schedule dan Picture Based On Schedule . Sebenarnya masih ada satu
lagi yaitu Page Banner, namun yang satu ini telah kita bahas pada bab Multimedia
dan animasi.
344
http://www.SmartOnlineSchool.com
" Sekolah Khusus Netter Indonesia "
6. Klik Finish, muncul kotak dialog Substitution Properties, yang
menyediakan pilihan keterangan yang akan disisipkan.
345
http://www.SmartOnlineSchool.com
" Sekolah Khusus Netter Indonesia "
Gambar 11.34 Tampilan include content - substituion - Author pada browser
346
http://www.SmartOnlineSchool.com
" Sekolah Khusus Netter Indonesia "
Gambar 11.35 Pilihan Include Content - Page
4. Lalu klik tombol Finish, kotak dialog Include Page Properties seperti Gambar
11.36 akan terbuka.
347
http://www.SmartOnlineSchool.com
" Sekolah Khusus Netter Indonesia "
Gambar 11.37 Kotak dialog pencarian file
6. Setelah file ditemukan, klik OK. File sisipan tersebut akan ditempatkan di dalam
dokumen Anda pada titik di mana kursor tersebut berada. Hasilnya tampak
seperti informasi biasa, seperti halnya jika Anda menempatkannya sendiri secara
langsung dengan cara menulis teks atau memasang gambar. Lihat Gambar 11.22.
Jika Anda menunjuk halaman sisipan tersebut dengan mouse, maka pointer mouse
akan berubah menjadi tangan memegang file.
Kalau Anda klik ganda bagian sisipan tersebut maka kotak dialog seperti Gambar
11.36 akan terbuka kembali.
348
http://www.SmartOnlineSchool.com
" Sekolah Khusus Netter Indonesia "
Gambar 11.38 Halaman yang mengandung halaman sisipan
Web Component ini dirancang untuk memasukkan file -file yang terdapat di dalam
Web Anda.
Kalau dijalankan di web, hasilnya seperti Gambar 11.39.
349
http://www.SmartOnlineSchool.com
" Sekolah Khusus Netter Indonesia "
4.3 Penyisipan halaman secara otomatis (Pages Based On Schedule)
Pada bab sebelumnya Anda telah melihat bagaimana cara menjadwalkan penyisipan
gambar untuk waktu tertentu. Nah, sebenarnya Anda dapat melakukan hal yang
sama untuk penyisipan sebuah file halaman. Misalnya, Anda dapat mengeluarkan
pernyataan pers secara otomatis yang akan disisipkan ke dalam sebuah dokumen,
pada saat bersamaan dengan peluncuran sebuah produk, atau menyisipkan sebuah
pesan mengenai sebuah jadwal acara pada hari tertentu.
Cara penyisipannya sama dengan pada penyisipan file gambar, yaitu:
1. Tempatkan kursor pada lokasi yang Anda inginkan.
2. Lalu aktifkan Insert _ Web Component. Muncul kotak dialog Insert Web
Component.
350
http://www.SmartOnlineSchool.com
" Sekolah Khusus Netter Indonesia "
Gambar 11.40 Kotak dialog Scheduled Include Page Properties
9. Untuk memilih file, klik tombol Browse, tampil kotak dialog untuk pencarian
file. Lalu carilah file yang ingin Anda masukkan.
351
http://www.SmartOnlineSchool.com
" Sekolah Khusus Netter Indonesia "
11. Anda bisa menyisipkan file lain (barangkali diperlukan sebagai pelengkap file
sisipan utama) dengan klik tombol Browse kedua.
12. Kemudian tentukan jadwal yang Anda inginkan pada kotak-kotak pilihan yang
tersedia. Baik pada kelompok Starting (untuk penentuan saat mulai) dan
Ending (penentuan saat akhir).
13. Setelah selesai dengan benar, klik OK. File itu akan ditempatkan di dalam
dokumen Anda pada titik di mana kursor tersebut berada sesuai jadwal yang
telah Anda tentukan.
352
http://www.SmartOnlineSchool.com
" Sekolah Khusus Netter Indonesia "