membuat web blog...membuat web blog 1 edisi khusus dreamweaver mx 2004 dan active server pages...
TRANSCRIPT
-
MEMBMEMBMEMBMEMBMEMBUAUAUAUAUAT T T T T WEB BLOGWEB BLOGWEB BLOGWEB BLOGWEB BLOG 1
Edisi Khusus Dreamweaver MX 2004dan Active Server Pages
MembuatWeb Blog
Kalau ada teknologi website yang sanggup menciptakan kehebohan dan trend,itu pastilah web blog. Awal bulan Juni 2004 lalu diselenggarakan kopi darat parablogger yang kali ini mengambil tempat di lereng Gunung Merapi Yogyakarta,atau lebih tepatnya di Kaliurang. Acara ini diramaikan oleh kira-kira 100 lebihblogger dari seantero pulau Jawa. Bahkan kabarnya, peserta yang berasal dariBandung Jawa Barat berani menumpang Pesawat Hercules hanya untuk mera-
maikan acara para pecandu “online diary” ini.
-
2
Pendahuluan
Mencari Definisi
DefinisiWeb Blog
Kurang jelas siapa yang pertama kali menemukan teknologi ini. Yang pasti, ditilik dariteknik pembuatannya, web blog tidaklah berbeda jauh dibanding Guest Book atau Elec-tronic News biasa. Tentu, di dalam buku ini Anda akan belajar banyak bagaimana mem-buat Web Blog menggunakan Dreamweaver MX 2004 dan Active Server Pages.
Lantas, apa itu sebenarnya web blog? Defi-nisi web blog sangat mudah dicari di inter-net. Namun, dari segudang referensi yangada, semuanya pada mengacu ke satu isti-lah yang sama, yaitu web blog adalahonline journal atau online diary (buku ha-rian online) yang dipublikasikan lewat in-ternet dan boleh dibaca oleh siapa saja.Coba Anda lihat definisi web blog yang di-angkat dari kedua situs berikut ini:
“On a Web site, a blog, a short form forweblog, is a personal journal that is fre-quently updated and intended for generalpublic consumption.”—situs Whatis.Com
“Short for Web log, a blog is a Web pagethat serves as a publicly accessible personaljournal for an individual. Typically updateddaily, blogs often reflect the personality ofthe author.”—situs WebOpedia.Com
Yang jelas, web blog punya beberapaciri khas yang unik. Pertama, isi web blogdi-update (diperbarui) setiap saat oleh sipemiliknya. Isi web blog bermacam-ma-cam, mungkin berisi pengalaman kese-harian si pemilik, unek-unek, cerita, ataukeadaan jiwa si pemilik yang dicurahkan
kepada khayalak umum dan menjadi kon-sumsi banyak orang. Dilihat dari sifatnya,web blog ini sangat mirip dengan buku ha-rian pribadi. Hanya saja, kalau kita maumain perbandingan, buku harian pribadionline ini jelas beda jauh dengan buku ha-rian pribadi biasa yang sering dimilikigadis-gadis SMP atau anak kecil.
Dulu, kita sering melihat buku harianpribadi yang dilengkapi gembok logam.Kalau tidak bergembok, pasti buku terse-but disimpan di tempat yang paling rahasiayang hanya si pemiliknya saja yang tahu.Tapi, web blog berbeda 180 derajat. Justru“buku harian online” ini terbuka bagisiapapun—tanpa kecuali! Tak ada user-name password atau hidden link di dalam-nya, semua bisa membaca.
Lantas, bagaimana caranya membuatweb blog itu? Bagi orang awam, membuatweb blog merupakan angan-angan jikamereka harus bersentuhan dengan bahasapemrograman berbasis internet sepertiPHP atau ASP. Untuk itu, mereka butuhlayanan pembuatan web blog instan yanggratis. Di internet, ada segudang alamatwebsite yang disediakan bagi mereka yangingin memiliki web blog pribadi namun ti-dak tahu bagaimana melakukan scripting.Beberapa di antaranya adalah Blogger.Com, Xanga.Com, LiveJournal.Com, danmasih banyak lagi.
Aturan mainnya, mereka tinggal regis-ter (mendaftar) dan mereka akan menda-pat web blog pribadi secara gratis.
-
MEMBMEMBMEMBMEMBMEMBUAUAUAUAUAT T T T T WEB BLOGWEB BLOGWEB BLOGWEB BLOGWEB BLOG 3
Blogger.Com:Blogger.Com:Blogger.Com:Blogger.Com:Blogger.Com: Bagi para pengguna awam atauorang yang tidak terbiasa dengan web scripting,Blogger.Com merupakan pilihan yang menarik.
Xanga.Com: Selain Blogger.Com, pilihan lainyang tak kalah menarik adalah Xanga.Com yangmemiliki lebih banyak layanan.
Mengumpulkan Teknologi
Teknologi Apa Sajayang Anda Butuhkan?
Untuk membuat web blog sendiri, Anda
butuh beberapa teknologi. Semua teknolo-
gi ini mudah dicari dan ada di sekitar Anda.
Apa saja teknologi itu? Lihat point-point
berikut ini:
� Macromedia Dreamweaver MX 2004:
Software ini berfungsi untuk mendesain
tampilan web blog ini nantinya. Versi
yang kita pakai untuk membuat web
blog adalah versi MX 2004 yang dirilis
kira-kira akhir 2003 lalu.
� MS Access: Aplikasi web blog membu-
tuhkan database. Di dalam database ini-
lah semua arsip web blog disimpan dan
sewaktu-waktu dapat dimunculkan
kembali. Anda bebas menggunakan ver-
si berapapun untuk software MS Access
ini.
� MS Windows 9x/2000/2003: Untuk
scripting, kita memilih Active Server
Pages. Dan, teknologi ASP ini baru bisa
bekerja dengan maksimal pada sistem
operasi MS Windows yang sudah dileng-
kapi server, entah PWS atau IIS. Jadi,
pastikan sistem operasi Anda memiliki
salah satu jenis server di atas.
� Browser: Software ini berfungsi untuk
menguji script secara live dalam kompu-
ter Anda. Anda bisa menggunakan
browser Internet Explorer, Netscape
Navigator, atau Neoplanet sekalipun. Ti-
dak menjadi masalah tentang versi
browser yang dipakai sebab script ini be-
kerja secara server side.
Tentu, kurang seru rasanya kalau Anda
memanfaatkan fasilitas gratisan seperti di
atas. Bagi Anda yang tahu sedikit-sedikit
tentang web programming, Anda bisa
membuat web blog sendiri. Dalam buku
Special Project ini, Anda akan belajar ba-
gaimana memadukan software Dream-
weaver MX 2004, database MS Access, dan
teknologi Active Server Pages untuk mem-
buat web blog yang tak kalah serunya de-
ngan web blog lain yang digarap oleh ka-
langan profesional.
-
4
Langkah 1:
MembuatDatabase
Pertama-tama, kita harus membuat data-base terlebih dulu tempat arsip-arsip webblog diletakkan. Aplikasi yang kita butuh-kan hanyalah MS Access yang sebagian besardari Anda memilikinya.
Langkah pertama adalah meluncurkanaplikasi MS Access yang ada di komputerAnda sampai Anda menjumpai tampilanseperti berikut ini:
First Step:Tampilansepertigambar disamping iniakan dijumpaisegerasetelah AndameluncurkanMS Access.
Kemudian pilihlah Option Blank Ac-cess Database. Setelah itu tekan tombolOK. Sebelum Anda mendesain tabel data-base, Anda harus menciptakan file data-base terlebih dulu. Simpan dengan namaBlog. mdb dan simpanlah di folderC:\InetPub\wwwroot\Webblog. Jika folderini belum ada, buatlah terlebih dahulu.
Blog.mdb: Sebelum mendesain tabel database,Anda harus membuat filenya terlebih dulu. Buatdengan nama blog.mdb dan simpan di folderC:\InetPub\wwwroot\Webblog.
Selanjutnya, pilih Create Table in De-sign View jika Anda sudah masuk ke tam-pilan seperti gambar berikut ini:
Create Table in Design View: Supaya Anda tidakkesulitan saat mendesain tabel database, pilihlahoption ‘Create Table in Design View’.
Sekarang, Anda tinggal mendesain ta-bel database seperti contoh tabel berikutini:
NomorAutoNumberBlogID TextTanggal Date/TimeWaktu Date/TimeNama TextJudul TextBlog Memo
F F F F Field Data ield Data ield Data ield Data ield Data TTTTTypeypeypeypeype
Jika Anda sudah mendesain tabel se-perti di atas, pilihlah field Nomor dan jadi-kan ia Primary Key.
Kemudian, tekan tombol File > Save.Sejenak akan muncul jendela di manaAnda harus memberi nama pada tabel ter-sebut. Beri nama ‘Webblog’.
-
MEMBMEMBMEMBMEMBMEMBUAUAUAUAUAT T T T T WEB BLOGWEB BLOGWEB BLOGWEB BLOGWEB BLOG 5
Save As:Save As:Save As:Save As:Save As: Berilah nama untuk tabel ini dengannama ‘Webblog’.
Langkah 2:
Membuat Aplikasi Pertama,CreateBlog.asp
Karena baru pertama kali dibuat, databaseweb blog yang tadi telah kita ciptakan ma-sih dalam kondisi kosong. Untuk itu, kitaharus mengisinya dengan record-recordagar website ber-blog ini memiliki contentseperti yang kita harapkan. Bagaimanamengisi record ke dalam database itu? Kitabisa melakukannya lewat script ActiveServer Pages.
Pertama kali, kita akan buat scriptyang nanti kita beri nama CreateBlog.asp.Aplikasi ini akan menghasilkan form tem-pat para pengunjung (blogger) mencurah-kan isi hatinya.
Mari kita ciptakan script CreateBlog.asp lewat bahasan-bahasan berikut ini.Langkah pertama adalah membuat head-line untuk memberi tahu pengunjung bah-wa form ini berfungsi untuk membuat blogbaru. Tekniknya cukup sederhana, yaitu de-ngan menggunakan potongan berikut ini:
Creating New Web Blog
Tentu Anda bisa mengubah headline diatas sesuka hati Anda. Kemudian, kita cip-takan form. Mengapa? Karena tanpaform, pengunjung tidak bisa mengisinama, isi hati, serta data-data lainnya.Langkah pertama untuk membuat formadalah dengan pernyataan berikut:
Itu artinya, begitu tombol Submit di-tekan, data-data yang ditulis oleh para pe-ngunjung akan terkirim ke scriptinsertblog.asp yang nanti akan kita buatbelakangan.
Setelah itu, kita buat sekali lagi sema-cam headline dengan ukuran lebih kecil.Fungsinya untuk menegaskan agar pe-ngunjung memasukkan data-datanya padaform yang telah tersedia. Caranya yaitu de-ngan menulis potongan berikut:
Tulislah curahan hatimu pada Formberikut ini:
Kalau sudah begini, kita tinggal mema-sukkan semua komponen yang diperlukanke dalam halaman web. Inilah script leng-kapnya untuk memasukkan komponen-komponen itu.
Tanggal:
Pukul:
Namamu:
Judul:
Isi Hatimu (Blog): -
6
Langkah 3:
Membuat Aplikasi Kedua,InsertBlog.asp
Kalau seorang blogger sudah memasukkandata-datanya pada form di atas, ke-manakah data-data itu akan pergi? Tentu,data-data itu akan masuk dan tersimpanrapat ke dalam database. Hanya saja, siapayang bertugas untuk menyimpan data-data itu ke dalam database? Kali ini kitaakan membuat script yang bertanggung ja-wab untuk mengemban tugas itu. Kitamemberinya nama Insertblog.asp.
Pertama kali, kita mengikutsertakanfile adovbs.inc lewat satu baris pernyataandi bawah ini:
File ini sendiri berisi konstanta-kon-stanta yang dibutuhkan script untuk me-nangani manipulasi database. Langkah be-rikutnya adalah membuat variabel-variabelyang diperlukan dalam script meskipunlangkah ini sebenarnya tidak mutlak harusdilakukan. ASP mengizinkan Anda mem-buat script tanpa mendeklarasikan variabelterlebih dulu.
Kita akan segera melakukan koneksimenuju database lewat metode DSN-lessConnection. Yang paling penting kita la-kukan adalah menentukan letak file data-
base ‘blog.mdb’ secara tepat. Sebab jikameleset, script pasti akan error. Potonganbaris berikut ini berfungsi untuk menen-tukan lokasi file ‘blog.mdb’ secara tepat,yaitu menggunakan Server.Mappath:
Setelah itu, kita ciptakan koneksi lewatmetode DSN-less Connection seperti ini:
Kini, koneksi menuju database telahterjalin. Sekarang, kita butuh akses menujurecord yang ada di dalam database itu entahuntuk keperluan menambah record baru,menghapus, atau memodifikasinya. Kali ini,kita butuh akses seperti itu untuk menambahrecord baru. Caranya yaitu dengan menggu-nakan recordset object seperti ini:
Pada pernyataan kedua, kita akanmembuka tabel database bernama‘Webblog’ yang dulu kita buat. Selanjut-nya, kita pilih recordset parameter untukCursor Type berjenis ‘adOpenKeySet’ danLock Type berjenis ‘adLockOptimistic’. Pa-sangan cursor type dan lock type ini sangatideal untuk penambahan record baru.
Sebelum kita memasukkan recordbaru ke dalam database, kita akan berma-in-main dengan bilangan acak. TentuAnda ingat bahwa dalam tabel database‘Webblog’ terdapat field ‘BlogID’. Field ini
Lihatlah masing-masing komponenform di atas. Tampak hanya text-box‘Tanggal’ dan ‘Pukul’ yang sudah terisi olehdata di dalamnya. Data yang masuk adalahdata tanggal sekarang ‘’ dandata waktu sekarang ‘’. Selainitu, masing-masing text-box dan text areabelumlah terisi oleh data apa pun. Ingatbahwa Anda harus memberi nama padamasing-masing text-box secara spesifik.
-
MEMBMEMBMEMBMEMBMEMBUAUAUAUAUAT T T T T WEB BLOGWEB BLOGWEB BLOGWEB BLOGWEB BLOG 7
Langkah 4:
Uji Coba Script CreateBlog.aspdan InsertBlog.asp
Sekarang, mari kita uji kedua script di ataslangsung menggunakan browser. Langkahpertama yaitu luncurkan browser (IE,Netscape, NeoPlanet). Kemudian, ketikURL berikut ini: http://localhost/webblog/createblog.asp.
bertugas untuk merekam nomor ID setiapweb blog yang masuk. Dan, seperti layak-nya nomor ID yang lain, nomor ID webblog ini unik satu dengan lainnya. Lantas,bagaimana cara membuatnya? Di sini, sayaakan menciptakan angka acak yang diha-silkan lewat pernyataan berikut ini:
Pertama kali, angka acak akan tersim-pan di dalam variabel ‘acak’. Semakin ba-nyak rentetan angka yang kita tuliskan diatas, semakin besar pula kombinasi nomorID yang akan dihasilkan. Setelah angkaacak berhasil diciptakan, di depan angkaitu akan disisipi kata ‘Blog’ seperti tampakpada baris ketiga di atas. Dengan begitu, sa-lah satu record yang ada di field ‘BlogID’mungkin seperti ini: “Blog4231953106”.Baru setelah itu, kita ciptakan record baruke dalam database menggunakan metodeAddNew dari Recordset seperti ini:
Lantas, record-record itu akan masukdalam rupa apa? Lihat potongan-potonganbaris berikut ini:
Itu artinya, field ‘BlogID’ akan terisioleh nilai yang ada di dalam variabel ‘acak’.Sedang field ‘tanggal’, ‘waktu’, ‘judul’,‘nama’, dan ‘blog’ akan terisi oleh data-data
yang telah dimasukkan oleh pengunjungke dalam masing-masing komponen form(text-box, text area dan lain-lain).
Setelah itu, kita pakai metode Updateseperti ini agar record-record tadi benar-benar tersimpan di dalam database.
Lantas, apakah record-record itu berha-sil masuk ke dalam database? Untuk mem-buktikannya, kita akan memunculkan isidatabase ke dalam jendela browser.
Pertama kali, kita munculkan isi darifield ‘Judul’ ke layar browser lewat pernyata-an berikut ini:
””
Jika sudah, kita munculkan pula field-field yang lain seperti ‘Tanggal’, ‘Waktu’,‘Nama’ dan sebagainya:
Tanggal: Pukul: Dibuat oleh:
Terakhir, kita munculkan isi blog ke jen-dela browser lewat cara yang sama seperti ini:
Setelah selesai memakai database, kitatutup akses menuju record-record itu lewatpernyataan ini:
-
8
Membuat Web Blog Baru: Form di samping iniberfungsi untuk membuat web blog baru yangdapat dimanfaatkan oleh siapa saja.
Menengok Blog Baru: Blog yang telah berhasildibuat akan dimunculkan ulang ke jendelabrowser agar Anda sebagai si pengarangnya bisamelihat kembali apa yang baru saja Anda tulis.
Beberapa Catatan Kecil
1. Buatlah minimal lima blog sekaligusdengan mengulangi proses pembu-atan blog lewat browser seperti taditelah kita lakukan. Jika Anda mem-buat kurang dari lima blog makascript ‘blog.asp’ yang akan kita buatsetelah ini akan menghasilkan error.
2. Kedua script yang tadi telah kitabuat, yaitu createblog.asp daninsertblog.asp, dapat Anda temukandi dalam CD dalam versi lengkap.
Setelah itu, tekan tombol Submit.Server akan memproses script insert-blog.asp dan akan merekam semua datayang Anda tuliskan dalam komponenform ke dalam database. Dan kini, data-data yang telah tersimpan itu munculkembali ke hadapan Anda lewat jendelabrowser seperti gambar di bawah ini:
Anda akan melihat tampilan web ber-form tempat Anda membuat blog baru.Isikan data-data Anda ke dalam form yangtelah tersedia seperti gambar di bawah ini.
Langkah 5:
Membuat ScriptBlog.asp
Apa yang tadi telah kita buat? Tadi, kitamembuat dua buah script, yaitu create-blog.asp dan insertblog.asp yang berfungsiuntuk merekam atau menyimpan blogbaru yang ditulis seorang blogger ke dalamdatabase. Tentu, perjalanan kita tidak ha-nya berhenti sampai di sini saja. Kita harusmemuaskan rasa ingin tahu blogger-blogger yang lain tentang isi pikiran rekan-rekan mereka. Caranya? Kita munculkanrecord para blogger itu ke halaman web.
Dengan kata lain, kita ingin membuathalaman utama web blog ini. Di sini, blog-blog terbaru akan dimunculkan dalam ha-laman utama agar semua orang, entah par-tisan atau pembaca setia, dapat menikmatiblog-blog itu. Untuk mewujudkan hal ini,kita butuh sebuah script yang akan kitaberi nama Blog.asp.
Marilah kita telusuri langkah demilangkah pembuatan script Blog.asp ini.
-
MEMBMEMBMEMBMEMBMEMBUAUAUAUAUAT T T T T WEB BLOGWEB BLOGWEB BLOGWEB BLOGWEB BLOG 9
Pertama kali, kita tentukan dulu juduldari website ini. Judul ini akan muncul dijendela browser. Teks yang diapit tag… dari HTML akan men-jadi judul website ini. Ubahlah sesuai seleraAnda jika perlu.
::Welcome to My Web Blog! ::
Langkah kedua adalah menciptakankoneksi menuju database. Cara ini pernahkita pakai saat membuat insertblog.asp.Tekniknya sama persis, yaitu denganmenggunakan DSN-Less Connection:
Kalau koneksi sudah terjalin, kita bukaakses menuju record-record yang ada di da-lam database menggunakan Recordset Ob-ject seperti ini.
Lihat perintah SQL di atas yang berbu-nyi “SELECT * FROM Webblog ORDERBY Tanggal, Waktu DESC”. Itu artinya,kita akan mengambil semua field dari tabel
‘Webblog’. Nanti, record-record yang adadi semua field itu akan ditampilkan ke jen-dela browser. Bagaimana dengan urutan-nya? Record-record itu akan diurutkanberdasarkan field ‘Tanggal’. Lantas? Meto-de pengurutan yang kita ambil adalahDESC yang artinya record terbaru yangmemiliki tanggal atau waktu paling baruakan muncul di atas disusul record-recordyang memiliki tanggal atau waktu lebihlama. Dengan begitu, blog-blog yang mun-cul di halaman ini akan selalu baru.
Sekarang, kita akan atur berapa blogyang akan muncul di halaman utama.Ingat bahwa dengan semakin banyak blogyang masuk ke halaman utama, akses webmenuju situs ini akan lebih melambat. Ca-ranya yaitu dengan mengatur PageSize se-perti contoh di bawah ini:
Kalau kita isi dengan angka 5 makablog yang akan muncul di halaman utamaini berjumlah lima buah. Kalau kita ubahmenjadi angka 2 maka hanya ada dua blogsaja seperti gambar di samping.
Ingat bahwa Anda paling tidak harusmemiliki jumlah blog lebih besar dari ang-ka yang Anda set di PageSize. Itu artinya,kalau Anda set PageSize sama dengan 5maka minimal Anda harus punya limarecord blog terlebih dulu di dalam data-base. Jika tidak maka script di atas akan er-ror.
Setelah pengaturan di atas selesai, kitaakan tulis judul untuk halaman web diatas. Judul ini diatur oleh baris-baris scriptdi bawah ini:
MY WEB BLOG
-
10
Mengatur PageSize:Mengatur PageSize:Mengatur PageSize:Mengatur PageSize:Mengatur PageSize: Jika Anda mengaturPageSize sama dengan 2 maka hanya ada duablog dalam halaman utama seperti gambar diatas. Berapa jumlah blog yang akan munculbergantung pada angka yang Anda masukkan disini.
Jika Anda ingin menggantinya dari‘MY WEB BLOG’ menjadi teks Anda sen-diri, ubahlah bagian itu sesuai keinginanAnda.
Kini, kita akan membuat tabel 1 ko-lom dan 1 baris. Tujuannya, agar teks blogyang muncul nanti tidak terlalu meman-jang ke kanan dan ke kiri. Artinya, kitamembatasi rentang teks blog agar tampaklebih rapi dan artistik. Untuk membuat ta-bel, kita butuh tag HTML berikut ini:
-
MEMBMEMBMEMBMEMBMEMBUAUAUAUAUAT T T T T WEB BLOGWEB BLOGWEB BLOGWEB BLOGWEB BLOG 11
Memunculkan Judul: Langkah pertama, kitamunculkan judul Blog terlebih dulu ke jendelabrowser seperti pada contoh di atas.
curahan hati tersebut. Tapi, supaya tampil-annya tidak timpang, huruf yang memolesteks ini dibuat lebih kecil dari yang lain.
Cara untuk menampilkan data-datatersebut adalah sebagai berikut:
Dibuat oleh: Tanggal: Pukul:
Terakhir, baru kita munculkan isi blogke dalam halaman web. Sampai langkahini, semua isi blog beserta data lainnya su-dah muncul seluruhnya.
Data-data Lainnya: Meskipun kecil, namun data-data pendukung seperti tanggal dan waktupembuatan serta siapa yang mencurahkan isihatinya itu memiliki peranan yang penting.
Setelah itu, kita tulis dua baris script dibawah ini. Tujuannya, agar ketika script se-lesai dengan record pertama, ia akanmembaca record kedua, ketiga, dan sete-rusnya sampai pengulangan For…Next iniberhenti.
Seperti skema di atas, hanya ada kira-kira lima blog yang akan muncul di hala-man utama ini. Lantas, bagaimana nasibblog terakhir jika muncul blog ke enam?Otomatis, blog yang paling lama akantergeser dengan yang baru. Namun jangankhawatir sebab nasib blog yang terakhir inibelumlah tamat. Seperti layaknya web bloglainnya, blog-blog yang lama akan masukke dalam arsip. Dan, arsip-arsip blog iniakan diatur oleh script khusus. Para
-
12
Tahap Akhir: Kini, halaman web blog ini tampilseutuhnya.Anda boleh memodifikasi scriptBlog.asp untuk menghasilkan output yangberagam dan beraneka rupa.
Langkah 6:
Membuat ScriptBlogArchieves.asp
Seperti telah disinggung di atas, koleksi
blog yang telah ‘usang’ janganlah kita bu-
ang begitu saja. Terkadang, banyak blogger
suka membaca blog-blog yang justru sudah
lama di-posting. Lantas, di mana kita me-
letakkan koleksi blog yang lama itu? Da-
lam halaman web utama, Anda melihat
link bertuliskan ‘Arsip Blog’. Jika link itu
diklik, pengunjung akan dibawa ke script
BlogArchieves.asp. Nah, script ini bertugas
untuk mengoleksi serta mendata semua
arsip blog yang ada di dalam database un-
tuk selanjutnya dimunculkan ke jendela
browser.
Berbeda dengan halaman utama, hala-
man yang nanti akan dihasilkan oleh script
BlogArchieves.asp ini terkesan lebih ring-
kas. Hal ini terjadi karena kita tidak me-
munculkan semua isi blog. Yang kita
munculkan hanyalah judul serta data-data
pendukung seperti tanggal dan waktu
pembuatan serta nama orang yang
mengarangnya.
Lantas, bagaimana caranya para blog-
ger membaca blog-blog itu? Caranya, di se-
tiap judul blog itu kita sisipi link yang akan
mengarah ke script lain, dalam hal ini ber-
nama blogdetail.asp yang akan kita buat
belakangan. Script ini bertugas untuk
mendeteksi BlogID yang dikirim oleh
blogArchieves.asp untuk selanjutnya isi
blog itu dimunculkan ke jendela browser.
blogger bisa masuk ke halaman khusus ar-
sip ini jika ia mengklik link ‘Arsip Blog’.
Lantas, ke mana blogger-blogger itu akan
pergi?
Lihat link berikut ini:
Arsip Blog
Jika link ini diklik, pengunjung akan
masuk ke script blogarchieves.asp seperti
tampak pada belahan script di atas.
-
MEMBMEMBMEMBMEMBMEMBUAUAUAUAUAT T T T T WEB BLOGWEB BLOGWEB BLOGWEB BLOGWEB BLOG 13
Bagaimana membuat BlogArchieves.
asp itu? Pada prinsipnya, 40% isi script
BlogArchieves.asp menyerupai script
Blog.asp. Pada tahap pertama, Anda buat
terlebih dulu judul halaman web ini meng-
gunakan baris-baris HTML berikut:
::Welcome to My Web Blog! ::
Setelah itu, kita ciptakan koneksi me-
nuju database menggunakan DSN-Less
Connection. Kalau sudah terjalin koneksi
itu, kita buka akses menuju record-record
yang ada di dalam database menggunakan
Recordset Object.
Di sini, kita masih menggunakan pe-
rintah SQL yang sama dengan perintah
SQL yang kita pakai pada script Blog.asp.
Selanjutnya, kita set judul halaman
web yang nanti akan muncul di jendela
browser sama seperti script Blog.asp di atas.
Caranya seperti ini:
MY WEB BLOG ARCHIEVES
Setelah kita membuat tabel agar pena-
taan lay out halaman ini lebih rapi, kita
akan memulai proses mengambil record-
record yang ada di dalam database ke jen-
dela browser. Teknik yang akan kita pakai
ini berbeda dengan teknik yang kita pilih
untuk script Blog.asp. Setelah kita membu-
at tabel agar penataan lay out halaman ini
lebih rapi, kita akan memulai proses meng-
ambil record-record yang ada di dalam da-
tabase ke jendela browser. Teknik yang
akan kita pakai ini berbeda dengan teknik
yang kita pilih untuk script Blog.asp.
Di sini, kita menggunakan pengulang-
an Do…Loop untuk membaca semua
record yang ada di dalam database untuk
kemudian dimunculkan ke jendela browser.
Pengulangan itu kita tuliskan seperti ini:
Itu artinya, pengulangan akan terus di-
lakukan sampai record terakhir dan kursor
menyentuh akhir file (End Of File). Atau
dengan kata lain, lewat pengulangan di
atas, kita ingin menampilkan semua
record yang ada di dalam database ke jen-
dela browser.
Setelah itu, kita munculkan judul blog
ke jendela browser. Tekniknya cukup se-
derhana. Hanya saja, seperti tadi telah kita
singgung, di dalam judul blog ini tertanam
sebuah link. Link ini jika diklik akan mem-
bawa si blogger itu ke script lain, yaitu
BlogDetail.asp. Caranya seperti berikut ini:
-
14
”>
Apakah cukup berhenti di sini? Tidak.
Lihat teknik penulisan URL di atas pada
atribut href. Jika link di atas diklik maka
akan terjadi dua akibat yang akan muncul.
Pertama, pengunjung akan dibawa ke
script blogdetail.asp. Kedua, script blogar-
chieves.asp ini akan mengirim sebuah nilai
yang tersimpan di dalam variabel ‘BlogID’
seperti tampak pada penulisan alamat link
di atas ke script blogdetail.asp. Apa isi nilai
yang tersimpan di dalam variabel ‘BlogID’
ini? Isinya adalah record yang ada di field
‘BlogID’ dalam database. Lantas, apa fung-
si nilai itu? Kita akan membahasnya saat
membuat script blogdetail.asp.
Setelah kita memunculkan judul blog,
kita tayangkan data-data pendukung se-
perti tanggal, waktu dan sebagainya. Tek-
niknya sama dengan teknik yang telah kita
pelajari waktu lalu:
Dibuat oleh:
Tanggal:
Pukul:
Kini, kita memasuki langkah-langkah
terakhir. Pertama, setelah selesai dengan
satu record, kita gerakkan kursor ke record
selanjutnya menggunakan MoveNext se-
perti ini.
Kedua, kita perintahkan server agar
melakukan pengulangan kembali sampai
kursor menyentuh End Of File (EOF:
akhir dari file).
Arsip Blog: Lewat script khusus, kita munculkanarsip-arsip blog yang dulu pernah ditulis olehblogger dalam periode sekarang sampai waktupaling lama.
Langkah 7:
Membuat ScriptBlogDetail.asp
Tiba waktunya untuk membuat script tera-
khir, yaitu BlogDetail.asp. Script ini akan
muncul saat seorang blogger masuk ke ha-
laman arsip dan mengklik salah satu judul
yang ada di sana. Begitu mereka melaku-
kan hal tersebut, ia akan membaca isi blog
secara lengkap. Bagaimana hal ini bisa ter-
jadi? Kita akan telusuri satu demi satu ba-
ris-baris script yang ada di dalam tubuh
BlogDetail.asp ini.
Pada prinsipnya, baris-baris pertama
yang ada di dalam BlogDetail.asp ini sama
dengan yang lain. Coba tengok potongan
berikut ini:
-
MEMBMEMBMEMBMEMBMEMBUAUAUAUAUAT T T T T WEB BLOGWEB BLOGWEB BLOGWEB BLOGWEB BLOG 15
::Welcome to My Web Blog! ::
Perbedaan baru muncul tatkala kita
bekerja dengan perintah SQL. Lihat 2 baris
script berikut ini:
Di situ tampak satu baris perintah SQL
yang fungsinya untuk mengambil record
dari database. Lantas pertanyaannya,
record mana yang akan diambil? Tentu,
halaman web ini hanya akan memuncul-
kan blog yang masih memiliki ikatan de-
ngan judul yang telah dipilih oleh seorang
blogger. Bagaimana mendeteksinya? Kita
bisa menggunakan pernyataan WHERE
untuk menyeleksi record. Lihat potongan
perintah SQL di bawah ini:
WHERE BlogID=’” &
Request.QueryString(“BlogID”)&”’”
Perintah SQL hanya akan mengambil
record yang memiliki nilai pada field
‘BlogID’ sama dengan nilai yang dikirim
oleh script blogarchieves.asp lewat URL. Li-
hat link yang ada di dalam script
blogarchieves.asp berikut ini:
Ingat, begitu link diklik, variabel
‘blogID’ di atas akan menyimpan nilai se-
perti yang ada di record ‘BlogID’. Dan, de-
ngan menggunakan QueryString, kita am-
bil nilai itu untuk menyeleksi record.
Setelah record terseleksi, semuanya
menjadi lebih mudah. Kita tinggal melaku-
kan persiapan-persiapan awal untuk me-
moles tampilan halaman web ini. Pertama
kali, kita atur ulang judul halaman web ini
lewat tag-tag HTML berikut:
MY WEB BLOG DETAIL
Selanjutnya, kita munculkan judul
blog terlebih dulu ke jendela browser lewat
potongan baris di bawah ini:
Kemudian, baru disusul record-record
lainnya termasuk record yang bertindak
-
16
Catatan Kecil
Ketiga script, yaitu blog.asp, blogar-chieves.asp, dan blogdetail.asp ada da-lam CD pendamping buku.
Blog Detail: Begitu judul salah satu arsip blogdiklik, seorang blogger bisa melihat isi blogsecara lengkap lewat script yang sengaja kitarancang untuk itu, yaitu blogdetail.asp.
Mempercantik Blog
Memoles Blog denganDreamweaver MX 2004
Kini, kita sudah punya script web blog siap
pakai yang dapat Anda modifikasi sesuai
selera sendiri. Kalau boleh jujur, tampilan
wajah web blog yang baru saja kita buat ma-
sih sangat “mentah” dalam hal desain. Un-
tuk itu, kita akan mempercantiknya de-
ngan cara yang paling efektif dan efisien,
yaitu menggunakan Macromedia Dream-
weaver MX 2004—satu-satunya software
desain web paling lengkap dan canggih.
Kali ini, kita tidak bicara tentang
scripting ASP menggunakan Dreamweaver
MX 2004 meskipun hal itu bisa saja dilaku-
kan. Sebaliknya, kita bicara tentang
Dreamweaver MX 2004 dalam kaitannya
dengan desain web blog ini. Saya berharap
Anda sudah punya software ciptaan
Macromedia ini sehingga proses latihan
kali ini bisa berjalan tanpa masalah.
Langkah pertama, luncurkanlah Ma-
cromedia Dreamweaver MX 2004 yang ada
dalam sistem komputer Anda sampai
Anda melihat tampilan gambar seperti
pada gambar halaman 17 (kiri atas).
sebagai blog itu sendiri. Semuanya kita
munculkan di jendela browser lewat bebe-
rapa pernyataan di bawah ini:
Dibuat oleh:
Tanggal:
Pukul:
Sekarang kalau perlu, kita cantumkan
link untuk kembali ke halaman arsip atau
halaman awal lewat pernyataan ini:
Kembali ke
Arsip
Kembali ke Halaman
Utama
-
MEMBMEMBMEMBMEMBMEMBUAUAUAUAUAT T T T T WEB BLOGWEB BLOGWEB BLOGWEB BLOGWEB BLOG 17
Tampilan Utama Dreamweaver MX 2004:Begitu Anda me-launch software yang masihsaudara kandung Flash MX 2004 ini, Anda akanmenjumpai tampilan seperti gambar di atas.
ASP dalam Jendela Dreamweaver MX 2004:Tampak pada gambar di samping, scriptBlog.asp kita munculkan dalam jendelaDreamweaver MX 2004 seperti gambar disamping.
Di jendela itu muncul icon kuningbertuliskan ‘ASP’. Janganlah Anda sentuhatau malah dihapus sebab icon-icon itumewakili kode-kode ASP yang tak dapatditerjemahkan secara visual olehDreamweaver MX. Kali ini, kita akan bela-jar untuk mengganti warna latar belakangweb blog di atas dari putih menjadi warnalain.
Caranya, klik menu Modify dan pilih-lah Page Properties sampai Anda masuk kejendela seperti gambar di bawah ini.
Pastikan dalam bagian Category Andamemilih Appearance. Selanjutnya, klik ko-tak kecil yang ada di samping kanan Back-ground. Pilihlah salah satu warna favoritAnda segera setelah Anda melihat jendelawarna. Jika sudah, tekan OK. Sekarang, ha-laman web blog.asp sudah memiliki warnalatar belakang seperti gambar di bawah ini:
Klik pilihan Open dan bukalah script
Blog.asp sehingga script tersebut muncul
dalam jendela Dreamweaver MX 2004 se-
perti gambar di bawah ini.
Page Properties:Untuk mengaturwarna latar belakanghalaman web, pilihlahPage Properties (kiri).Sedangkan gambar dibawah adalah gambarjendela PageProperties untukpengaturan banyakhal yang berkaitandengan halaman web.
-
18
Blog.asp dengan Wajah Baru: Anda bisamendesain sendiri warna latar belakang favoritAnda.
Sekarang, kita akan mengganti judul
web blog tersebut yang semula teks ‘MY
WEB BLOG’ menjadi grafis. Sebelumnya
Anda harus mendesain terlebih dulu gam-
bar yang akan menjadi judul web blog itu.
Sebagai pedoman buat Anda, di dalam CD
tersedia file title.gif yang dapat Anda jadi-
kan contoh latihan. Bukalah file tersebut
dan Anda akan melihat contoh gambar se-
perti tampilan berikut ini:
Judul Berbentuk Grafis: Untuk mempercantiktampilan halaman web, terkadang kita harusmelibatkan file grafis meskipun di dalamnya iaberbentuk teks seperti gambar di atas.
Kemudian, tekan menu Insert dan pi-
lih Image. Selanjutnya, carilah file gambar
yang ingin Anda abadikan sebagai judul
web blog ini. Dalam contoh kali ini, Anda
bisa memanfaatkan file title.gif yang ada di
dalam CD.
Insert Image: Untuk memasukkan gambar kedalam halaman web, salah satu cara yangsering dipakai yaitu dengan menggunakanmenu Insert > Image Insert > Image Insert > Image Insert > Image Insert > Image seperti diperlihatkan padagambar di atas ini.
Wajah Baru Blog.asp: Setelah diberi judul dalamwujud gambar, halaman web blog.asp di atastampak lebih bagus meskipun kita baru bisamenikmati secara utuh lewat jendela browser.
Yang pertama kali harus kita lakukan
adalah menghapus teks ‘MY WEB BLOG’
terlebih dulu agar nanti bisa diganti de-
ngan file gambar di atas. Hapuslah dengan
cara memblok atau menghilangkan satu
demi satu huruf yang ada di situ.