Master page adalah sebuah
template atau layout tampilan sebuah web site yang akan digunakan oleh semua
halaman .aspx sehingga tampilan utama dari web tersebut akan sama. Tampilan
yang biasanya sama di semua halaman yang akan ditampilkan adalah gambar
background, menu item, footer dan link-link lain yang ada dalam web. Yang
berubah adalah content dari halaman tersebut.
Sebenarnya, hal seperti ini
sudah digunakan, yaitu dengan cara copy – paste dari satu halaman ke
halaman lain sehingga menghasilkan tampilan yang sama dengan content
yang berbeda. Kekurangan dari cara seperti ini adalah kemungkinan error dan
kesalahan tempat ketika akan di-paste. Kemudian, suatu saat, ketika kita
menambah halaman-halaman baru, cara copy – paste di atas akan kita lakukan
berulang, dan tentu saja bagi sebagian orang akan sangat membosankan.
Untuk
mengatasi hal tersebut diatas, ASP.NET 2.0 menyediakan tool yang diberi nama Master
page. Master Page adalah sebuah template yang digunakan untuk
mendesain tampilan yang akan digunakan di seluruh halaman web, ketika user
melakukan navigasi, secara otomatis halaman-halaman akan tampil menyatu dengan master
page tersebut sehingga content akan berubah. Master page akan dibuat
satu kali dan content akan tampil sesuai halaman yang dibuka.
Bekerja dengan Master Pages
Inheritance/pewarisan
visual yang ditambahkan ke ASP.NET 2.0 merupakan perbaikan besar di halaman web
karena anda dapat membuat halaman template tunggal yang dapat digunakan sebagai
fondasi untuk halaman isi di aplikasi anda. Template ini disebut sebagai master
pages yang akan menambah produktivitas anda karena mempermudah pembuatan
dan mengelola aplikasi.
Kenapa memerlukan Master Pages?
Kebanyakan
situs web sekarang ini memiliki elemen umum yang sama yang terdapat di
keseluruhan atau sebagian besar halaman dalam aplikasi. Elemen umum itu
misalnya seksi header yang berada diatas, seksi navigasi yang berada dikiri,
dan seksi footer yang berada dibawah halaman.
Sebelum
ASP.NET 2.0, ada beberapa cara yang digunakan developer web untuk menambah
elemen umum ke dalam tiap halaman dan dalam kebanyakan kasus merupakan proses
yang sulit.
Beberapa
developer melakukan copy dan paste kode untuk elemen umum ke tiap-tiap halaman
yang memerlukannya. ini akan bekerja tetapi kapanpun diperlukan perubahan
terhadap salah satu seksi dari elemen umum aplikasi, anda perlu melakukan
perubahan untuk tiap-tiap halaman.
Di
ASP klasik, salah satu pilihan yang popular adalah meletakkan seksi umum ke
dalam file include. Anda dapat menempatkan file dalam halaman anda
seperti berikut:
<!--
#include virtual=”/Includesku/header.asp”-->
Masalah
menggunakan file include adalah anda harus lebih dulu membawanya ke dalam akun
tag HTML di header file include. Tag ini akan ditutup dalam dokumen utama atau
difooter file include.
Biasanya
sulit mempertahankan semua tag-tag HTML. Dalam urutan, terutama jika beberapa
orang bekerja di suatu proyek. Halaman web kadang-kadang menampilkan hasil yang
aneh karena tag tidak sesuai atau tag yang tidak ada menutup atau membuka. Juga
sukar untuk bekerja dengan file include dalam suatu desainer visual.
Menggunakan file include, developer tidak bisa melihat keseluruhan halaman
bagaimana tampilannya di browser. Developer setelah menyelesaikan pengembangan
halaman dalam seksi hanya dapat berharap agar potongan kode akan bergabung
seperti direncanakan.
Dikenalkan
pada ASP.NET 1.0 developer mulai menggunakan user control untuk mengenkapsulasi
seksi umum dari halaman web mereka. Sebagai contoh, anda bisa membangun suatu
halaman web yang menyertakan seksi header, navigasi dan footer dengan hanya
menyeret dan menjatuhkan seksi dari kode ini ke tiap-tiap halaman yang
memerlukannya.
Teknik
ini bekerja, tetapi juga menghasilkan beberapa masalah. Pertama, user control menyebabkan permasalahan serupa
dengan file include. Ketika bekerja di tampilan desainer dari halaman web anda,
seksi umum dari halaman hanya menampilkan kotak abu-abu dalam Visual
Studio.NET. Ini akan mempersulit dalam membangun suatu halaman. Anda tidak bisa
melakukan visualisasi tampilan apa yang sedang dibangun secara actual di
halaman sampai anda mengkompilasi dan menjalankan halaman dalam suatu browser.
Masalah lain dengan user control adalah bahwa anda harus membuka dan menutup
tag HTML dengan baik sama halnya saat anda melakukan dengan file include.
Untuk memecahkan isu ini, tim
ASP.NET 2.0 telah sampai pada ide pembuatan master pages – suatu cara
terkemuka yang baru dari menerapkan templates ke aplikasi anda. Halaman master
pages menyimpan suatu garis terpisah antara area yang umum yang anda pindahkan
dari halaman ke halaman dan ke area isi yang unikdi tiap-tiap halaman.
Dasar-dasar Master Pages
Master pages adalah halaman
tunggal yang menangani struktur dari situs web anda. Master pages memiliki dua
fitur khusus yang berbeda dengan halaman lainnya. Pertama berisi tag khusus
yang mengidentifikasi sebagai master pages ke server web seperti contoh
berikut:
<%@ Master Language=”VB”
CodeFile=”MasterPage.Master.VB” Inherits=”Masterpage” %>
Tag directive (tag khusus yang
dipahami server dan tidak dikirim ke client) tersebut memiliki empat fitur
yaitu:
1.
Kata master membedakan halaman ini dengan halaman
standar.aspx yang menggunakan kata page.
2.
Atribut language
memberitahu anda bahwa halaman meggunakan Visual Basic untuk pengkodean.
3.
Atribut CodeFile
memberitahu anda bahwa master pages menggunakan code-behind dan kode
terletak pada file.
4.
Atribut Inherits
memberitahu anda bahwa class default untuk halaman ini adalah MasterPage, bukan
class lainnya.
Kedua, suatu master pages
berisi kontrol ContentPlaceHolder yang memberitahu seseorang menggunakan
master page ketika menambah informasi unik ke halaman web.
<asp:contentplaceholder
id=”contentplaceholder1” runat=”server”>
</asp:contentplaceholder>
Kode akan membuat daerah dalam
template yang akan diisi dengan bahan dari halaman isi yang dibuat oleh
pengembang.
Ketika berkeja dengan master
pages, anda akan membuat file master yang merupakan template untuk referensi
bagi subpage atau halaman isi/content page. Master pages menggunakan
ekstensi file .master, sedangkan halaman isi menggunakan ekstensi file .aspx.
Letakkan semua yang anda inginkan sebagai template dalam file .master.
termasuk seksi header, footer, dan navigasi yang akan digunakan sepanjang
aplikasi web. Halaman isi berisi semua isi halaman kecuali elemen master pages.
Pada saat aplikasi berjalan, engine ASP.NET akan mengkombinasikan elemen-elemen
tersebut ke dalam satu halaman tunggal untuk pengguna akhir.
