Asp.Net Mvc Layout Sayfaları – Render Page (Asp.Net Mvc Yazı Dizisi – 6)

Önceki Yazı : Asp.Net Mvc Layout Sayfaları – Render Section (Asp.Net Mvc Yazı Dizisi – 5)

Merhaba Arkadaşlar,

Önceki yazımızda, Render Section ile tasarım yaparken, nasıl parçalı tasarım yapabileceğimizi inceledik. Faydalarını gördük. Şimdi ise Render Page konusunu işliyor olacağız.

  • Peki bu Render Page nedir, ne iş yapar?

Bir sayfanın, bir kısmının içeriğine, başka bir sayfanın içeriğinin tamamını gömmemize yarar. Buna Html tarafında ki Iframe olayını örnek olarak verebiliriz. Ancak bu Render Page metodunda harici sayfa, gömülen sayfanın doğal bir içeriği gibi görünür. Bu yüzden SEO açısından da avantajlıdır. Hayal gücümüzü biraz kullandığımızda web sitesini, tarayıcı gibi bile kullanabilir, dinamik olarak sayfaları çağırabiliriz.

Şimdi bir örnek yapalım;

  • Önceki yazılarımızda oluşturduğumuz projemizi açalım.
  • Solution Explorer kısmı altından Views>Home klasörünü bulup sağ tıklayarak Add>View yolunu takip ediyoruz.

View ekleme ekranı

Yukarıda ki resimde ki ekranı biraz inceleyelim.

View Name : View'imizin adını teşkil etmektedir.

Template : Buradan View'imizin içerik tipini seçebiliriz. Detaylarını ilerleyen yazılarımızda inceleyeceğiz.

Model Class ve Data Context Class : Template kısmından veri kaynaklı bir tip seçtiğimizde aktif olmaktadır. Buradan, hangi kaynaktan veriyi çekeceğimizi belirleriz. Bunu da ilerleyen yazılarda inceleyeceğiz.

Create as a partial view : Eğer işaretliyse, View'imizin parçalı olmasını sağlar. Partial View konusunu bir sonraki yazımızda inceleyeceğiz.

Use a layout page : Eklediğimiz sayfada şu yazımızda incelemiş olduğumuz Layout'lardan istediğimizi seçip kullanmamızı sağlayan özelliktir. Alt kutulu alan boş bırakılırsa, Solution Explorer kısmı altında ki Views>_ViewStart.cshtml dosyasında belirtilen yoldaki Layout'u uygular.

  • View Name'mize RenderPageSayfa yazıp Add tuşuna tıklayalım.
  • Aşağıda ki kodların olduğu sayfa açıldı.
@{
    ViewBag.Title = "RenderPageSayfa";
}

<h2>RenderPageSayfa</h2>
  • Sayfamızın en altına 
<h3>Kategori Sayfası</h3>
<h5>Kategori Listesi</h5>
<ul>
<li>C#</li>
<li>Php</li>
<li>Java</li>
</ul>

içeriğini ekleyelim ve sayfamızı kaydedelim.

  • Views>Home>Index.cshtml dosyasını açalım. Sayfanın el altına aşağıdaki
@RenderPage("~/Views/Home/RenderPageSayfa.cshtml")

kod bloğunu ekleyelim.

Burada dikkat ederseniz, gömülecek olan dosyanın tam yolu girilmektedir. "~" karakteri ise ana dizini işaret etmekte, sonraki gelen kısımlar ise en üst dizinden, alta doğru yolu göstermektedir. Bu karakter Asp.Net'e özel bir karakter olup, Html ile ilgisi yoktur.

Evet eklememizi yaptıktan sonra, sayfamızı kaydedelim ve projemizi çalıştıralım.

Render pagenin sayfada görüntülenmesi

Görüldüğü gibi, sayfamıza bir başka sayfayı gömmüş olduk.

 

Bir yazımızın daha sonuna geldik. Sonraki dersimizde ise Partial View konusunu işleyeceğiz. 

Hepinize kolaylıklar diliyorum.