Buradasınız: Emre Supçin / Asp.Net / Master Page Kullanarak Nasıl Web Sitesi Oluşturabiliriz?

Master Page Kullanarak Nasıl Web Sitesi Oluşturabiliriz?

Merhaba arkadaşlar,

Dün yazdığım yazıda sizlere Asp.NET’te master page kullanımının nasıl olduğundan bahsetmiştim. Bu yazımda ise dün sizlere belirttiğim Master Page kullanarak web sayfasının nasıl oluşturulacağını anlatmak istiyorum. Şimdi Visual Studio’yu kullanarak, basit bir web sitesi oluşturacağız. Bu siteyi oluştururken Master Page kullanımını da öğrenmiş olacaksınız.

Visual Studio Master Page Oluşturmak emresupcin - Master Page Kullanarak Nasıl Web Sitesi Oluşturabiliriz?

Aşağıdaki adımları uygulayın ve dersimize giriş yapalım;

• Visual Studio’yu açın.

• File menüsünden New Web Site komutunu vererek boş bir site oluşturun. Ben MasterPage adında VB destekli bir site oluşturdum.

• Site klasöründe web.config dışında dosya varsa bunları silin.

• Website menüsünden Add New Item komutu vererek yeni bir Master Page oluşturacağız. Bu pencerede Master Page seçeneğini seçin. Dosya adı MasterPage.master olarak kalabilir. Aşağıdaki kutucuklardan ‘Select Master Page’ seçeneğinin önündeki işareti eğer varsa kaldırın. ‘Place Code In Seperate File’ seçili kalabilir.

• Varsayılan kodlarıyla beraber bir master sayfası oluşturulacaktır. Bu kodlarda iki şey dikkatimizi çekiyor: Birincisi sayfa direktifi Page değil Master olarak başlıyor. İkincisi ise ContentPlaceHolder adındaki ASP.NET kontrolleri sayfaya eklenmiş.

Buradaki ContentPlaceHolder kontrolü bizim içerik sayfalarımızın yer alacağı kısım. Yani ContentPlaceHolder dışında kalan yerler tüm sayfalarda ortak olacak. ContentPlaceHolder yazan yerlere ise ilgili sayfanın içeriği gelecek. Master sayfamızda bunlardan otomatik olarak iki tane oluşturulur. Birisi head etiketleri arasında birisi ise body etiketleri arasında. Biz istediğimiz yere istediğimiz kadar ekleyebiliriz. Fakat head etiketleri arasındaki ContentPlaceHolder kontrolünü bu örnekte kullanmayacağımız için kaldırın. Bizim kullanacağımız kontrol body etiketleri arasındaki ContentPlaceHolder kontrolü. Biz sitede değişmeyecek olan kısımları bu kontrolün etrafına yerleştirmeliyiz. Aşağıdaki kodları MasterPage.master dosyasının body etiketi arasında kalan kısmına yerleştirin:

1 <form id="form1" runat="server">

2 <div>

3 <a href="default.aspx">Anasayfa</a> |

4 <a href="digersayfa.aspx">Diğer sayfa</a>

5 <hr/>

6 <asp:ContentPlaceHolder id="ContentPlaceHolder1" runat="server" />

7 <hr/>

8 Burası sitenin alt kısmı.

9 </div>

10 </form>

Artık master sayfamız hazır. Sıra geldi, master sayfamıza içerik sayfalarını ‘gömme’ye. Devam edelim:

• Website menüsünden Add New Item komutu vererek yeni bir içerik sayfası oluşturacağız. Dosyanın adı Default.aspx olarak kalsın. Bu işlemin normal aspx dosyası eklemekten tek farkı Master Page kullanması. Dolayısıyla Add New Item penceresindeki aşağıdaki seçeneklerden ‘Select Master Page’ seçeneğinin önündeki işaretin seçili olması gerekiyor. ‘Place Code In Seperate File’ seçili kalabilir. Add butonuna bastığımızda bizden bu dosyayı hangi Master sayfasının içine yerleştireceğimizi soracaktır. Buradan MasterPage.master sayfasını seçerek devam edelim.

• Aşağıdaki kodları da Default.aspx sayfasına ekleyin:

1 <%@ Page Title="Anasayfa" Language="VB" MasterPageFile="~/MasterPage.master"

2 AutoEventWireup="false" CodeFile="Default.aspx.vb" Inherits="_Default" %>

3 <asp:Content ID="Content1" ContentPlaceHolderID="ContentPlaceHolder1" Runat="Server">

4 <h1>Anasayfa</h1>

5 Anasayfa içeriği burada yer alacak.

6 </asp:Content>

Burada dikkatimizi çeken şey sayfa direktifinde Title parametresiyle sayfa başlığını ayarlayabiliyoruz. Yine sayfa direktifinde bu dosyanın kullandığı master sayfasını MasterPageFile parametresinde görebiliriz. Onun dışında otomatik olarak oluşturulan Content kontrolünü görüyoruz. İçerik sayfasında bulunan tüm içeriğin bu kontrolün içerisine yazılması gerekiyor. Buraya yazdıklarımız master sayfasındaki ContentPlaceHolder kontrolünün bulunduğu yere dahil edilecek.

• Son olarak, aynı şekilde DigerSayfa.aspx dosyasını oluşturun.

Siteye bundan sonra ekleyeceğimiz her yeni dosyayı aynı şekilde ekleyebileceğiz. Bunun yanı sıra, master sayfamızda yapacağımız değişiklikler içerik dosyalarına otomatik olarak yansıtılacaktır.