Bu bölümde blogumuz için post yani gönderiler oluşturmak üzerinde duracağız. Aynı zamanda post’ları görüntülemeyi, postları kategorilerine göre sınıflandırmayı ve post akışını nasıl sınıracağımızı göreceğiz.

Son olarak da layout’ların nasıl içiçe kullanılabileceğine bakacağız.

 Markdown Dosyaları

jekyll markdown

Jekyll içerisinde postlar birer .md uzantılı birer markdown dosyası şeklinde tutulur. Her markdown dosyasının üstünde o dosya hakkında bize ve bloga bilgi veren bir YAML front matter bulunur. Örnek vermek gerekirse:

Dosyanın geri kalanı ise markdown olarak yazılır. Markdown yerine html yazarsanız da çalıştığını göreceksiniz.

Markdown’da örneğin # Heading yazmak <h1>Heading</h1> yazmaya karşılık gelir.

Jekyll posts adı verilen bir özelliğe sahiptir. Postlar blog gönderileri gibi belirli bir sırada olmalıdır. Bu sıra da tarih ile belirlenir. Postların isimlendirilmesi çok önemlidir.

Aşağıdaki dosyalar _posts içerisine oluşturalım:

Dosyaların içerikleri aşağıdaki linklerde belirtildiği gibi olacaktır:

news.html’in içeriği aşağıdaki gibiydi:

Şuna çevirelim:

Şimdi eğer News sayfasını açacak olursak bütün postların title ve meta değerleri bir döngü halinde ekrana gelecek.

Burada “news” sadece döngünün değişkeni yani news yerine “a” yazılsa yine çalışacaktır.

Makalemiz layout, title, meta, source, category değerleri barındırıyordu. Bu değerleri istediğimizi şekilde çekebiliriz.

Yani {{news.meta}} yerine {{news.category}} yazarsak kategoriler çekilir.

Jekyll : Post Kategorileri

Eğer birden fazla kategorimiz varsa kategori değişkenleri farklı olacak.

Postları kategorilerine göre klasörler içerisine alabiliriz.

Jekyll bunu umursamayacaktır. Hangi klasörde olduğu önemli değildir.

Böyle klasörler halinde sadece bizim için işleri biraz daha kolaylaştıracaktır.

News ve Recently Discovered adında iki klasör oluşturup postları buralara koyalım:

news klasörü altında :

Burada yer alan dosyalar birer md yani markdown dosyası.

recently-discovered klasörü altında :

Dosyaların içerikleri aşağıdaki linklerde belirtildiği gibi olacaktır:

Post Jekyll
news.html’in içeriği aşağıdaki gibiydi:

news.html’in içeriğini aşağıdaki gibi değiştirirsek sadece news kategorisindeki postları görüntüleyeceğiz:

Jekyll : Post Döngüsüne Limit Vermek

Gösterdiğimiz post sayısını sınırlandırmak isteyebiliriz. Bunun için tek yapmamız gereken döngünün sonuna limit eklemek.

news.html dosyamızı aşağıdaki gibi düzenleyelim :

Artık yalnızca iki tane post gösterilecek.

Jekyll : İçiçe Layoutlar

_layouts klasörümüze gidelim ve default.html dışında yeni bir html oluşturalım : news.html

Öncelikle layoutları tekrar etmekte fayda var. Hatırlayacak olursak layoutlar masterpage’ler gibi çalışıyorlardı.

Her sayfa kendisine ait layoutu belirttiğinde sayfanın içeriği layout’un content kısmına yükleniyordu. Yani her sayfa için benzer olan kısımlar layout içerisinde tutuluyorduk.

Bizim hem index.html sayfamız hem de news.html sayfamız default layout’unu kullanıyordu.<br>
Burada anlatmaya çalışacağımız şey : Bir layout default layoutun içerisine girebilir. <br>

Peki news sayfası içinde kendine ait bir navbar oluşturmak istediğimizi düşünelim.

News kendi içerisinde news ve recently-discovered olarak ikiye ayrılacak. Bu ikisi de kendilerine ait bir navbar’a sahip olacaklar.

Öncelikle ana dizine index.html ve news.html yanına bir de recently-discovered.html oluşturalım. İçeriği aşağıdaki gibi olsun:

Daha sonra ana dizindeki news.html‘yi açıp onun da layout’unu news yapalım.

Ardından _layouts içerisine bir news.html layout’u oluşturalım.

Farkettiyseniz aynı isimde iki dosya oldu fakat ayrı klasördeler.

_layouts içindeki news.html’nin içeriği aşağıdaki gibi olacak:

Böylece news ve recently-discovered sayfaları yeni news layout’unun içerisine girecekler.

Bu news layoutu da default layoutunun içerisine girecek.

news ve recently-discovered sayfalarına özel yeni nav’ımız böylece tamamlanmış oldu.

jekyll layouts

Kaynak: