published on 21.05.2018

Jekyll’a yeni başlayan biri için, kod bloklarını görüntülemek problemli bir iş olabilir. En azından benim için epey problemli oldu. Bu yazıda, karşılaşabileceğiniz problemlere karşı birkaç ipucu vermeye çalışacağım.

Olası Problem 1: Code Block vs Truncate

Eğer, yazılar kod bloğu içeriyorsa ve anasayfada postları yayınlamak için truncate fonksiyonunu kullanıyorsanız anasayfada herşeyin birbirine girmesi kaçınılmaz. Buna karşı, en azından benim bildiğim güzel bir çözüm yok. Ya truncate kullanmayacağız ya da bir şekilde post’un kod bloğu içerip içermediği kontrol edip ona göre davranması için dinamik bir yapı oluşturacağız. Stackoverflow’da (linki tekrar bulamadım) gördüğüm bir çözümü aşağıya aktarıyorum.

  • Post’un eğer tamamı yerine bir kısmının görülmesini istiyorsak o post içinde ilgili yere <!--break--> yazıyoruz.
  • Anasayfada tüm içeriği göstermek yerine bu anahtar kelimeye kadar olan kısmı gösteriyoruz ve “devamını oku” bağlantısı ekliyoruz.
{{ post.content | split:'<!--break-->' | first }}
{% if post.content contains '<!--break-->' %}
    <a href="{{ post.url }}">devamını oku</a>
{% endif %}

Çok iyi bir çözüm değil, çünkü yazarken bir yerde durup konu ile alakasız bir sözcük yazmanız gerekiyor. Daha iyi bir çözümünüz varsa yorum yazabilirsiniz.

Olası Problem 2: Kod Bloğunu Tanımlamak

İlk seçenek, {% highlight language %} (“language” yerine ilgili dil gelecek, highlight python, highlight csharp gibi) şeklinde liquid kodu ile tanımlamak ki çok kullanışlı olmayacak ve yazma şevkinizi kıracaktır. Çirkin çünkü.

İkinci seçenek ise, 3 tane grave accent ile Github tarzı fenced blocklar kullanmak. TR-Q klavyede AltGR + Virgül ile elde edebilirsiniz. Aşağıdaki satırları _config.yml dosyanıza ekleyerek, “input: GFM” satırı ile Github Flavored Markdown kullanacağımızı belirtiyoruz.

markdown: kramdown
kramdown:
  input: GFM
  syntax_highlighter: rouge

Daha fazla bilgi için: Github-Help, Rouge

Olası Problem 3: Farklı Renkleri Ayarlamak

Yukarıdaki satırlarda geçen “Rouge” ise jekyll’ın default syntax highlighter’ı ve Github sayfaları da Rouge kullanıyor. Tabii ki css dosyanızda “.highlight” classı ile ilgil bir şeyler yazmalı.

  • Pygments ile oluşturulmuş temaları kullanmak istiyorsanız richleland reposunda hazırı var.
  • Bunun dışında github’da google’da arayabilir, kendiniz renklerle oynayabilirsiniz.

Olası Problem 4: Liquid Kodunu Göstermek

Problem sayılmaz ama ek bilgi olsun. Kod bloğu içerisinde liquid syntaxında yazdığınız kodu eğer raw tagleri içine almazsanız yazdığınız kodu göstermeyecek çalıştıracaktır.

{ % raw % }
  Kodu buraya yaz.
  Ve tabii ki yüzde ile küme parantezleri arasında boşluk olmamalı.
{ % endraw % }
You are reading the 4th of 19 episodes in Jekyll.
Published on 21.05.2018 by Mert Bakır with commit 261e231.
jekyll
#code-highlighting #jekyll #static-site
Next episode:
Mathjax ile Matematiksel Gösterimler
published on 13.06.2018

Eğer, matematiksel bir şeyler yazıyorsanız matematiksel gösterimlere de ihtiyacınız olacaktır. Bu konuda akla ilk gelen belge hazırlama sistemi LaTeX‘dir. Peki, bir jekyll blogunda bu iş nasıl yapılır? Kullandığınız markdown işleyicisine göre farklı seçeneklere yönelebilirsiniz. Ben, kendi …

published on 16.06.2018

Eğer yazılarımıza etiket ekleyip arşivimizi de etiketlere göre filtrelemek istiyorsak, ihtiyacımız olanlar; […] Oldukça kolaydır, aşağıdaki gibi oluşturulabilir: […] {% assign posts = site.posts | sort: "date" | reverse %} {% for post in posts %} <li><a …

published on 31.05.2018

Daha önce Liquid: Sayfalandırma ve Dizi Filtreleme konusunda birkaç dizi operasyonundan ve döngülerden bahsetmiştim. Şimdi stringler ile oynayacağız. Öncelikle belirteyim, liquid syntax’ı kesinlikle matematikte iyi değil, zaten amacı da o değil. Buna bağlı olarak jekyll ile dinamik yapılar …

published on 17.04.2022
edited on 02.05.2022

Önceki bölümde, markdown formatını LaTeX formatına dönüştürmek için kullanılan Pandoc yazılımından bahsetmiştik. Şimdi konuyu bir adım daha ileri taşıyıp ve bookdown’a geçiyoruz. Bookdown; Rmarkdown kullanarak teknik dökümanlar, kitaplar yazabilmemizi sağlayan, Yihui Xie tarafından yazılmış …

published on 10.04.2022

I’ve been using WSL-2 on Windows for over a year. It’s very useful because some Python packages are just a headache to install on Windows. Also, docker. It’s just better on Linux. Yet, WSL-2 can also be problematic. I remember trying a dual-boot setup when things just went way too …

published on 03.03.2022

In this post, I’ll share how to install geopandas and some other gis related packages on Windows. If you are on Mac or Linux you can probably just pip install those without any issue. I usually had to do a google search every time I wanted to install these packages on Windows environment. Of …

published on 19.02.2022

Önceki yazıda LaTeX kullanmanın avantajlarından ve zorluklarından bahsetmiştim, MS Word gibi WYSIWYG programlar ile karşılaştırıp tavsiyelerimi yazmıştım. Bu yazıda Pandoc yazılımı üzerine konuşacağız. Pandoc’un da yardımıyla LaTeX’in avantajlarını alıp zorluklarını biraz geri de …

published on 12.02.2022

LaTeX bir çeşit döküman hazırlama sistemidir, ancak çoğumuzun alıştığı arayüzlerin aksine bu döküman içerisinde kod yazar gibi bazı komutlar kullanırız. Daha sonra derleyici (compiler) bu dökümanı bizim tanımladığınız kurallara göre PDF’e dönüştürür. […] 1978 yılında, Donald Knuth TeX …

published on 02.01.2022

This post is for fellow students who is studying Operations Research with CPLEX. If you don’t know already, IBM offers free academic license for IBM ILOG CPLEX Optimization Studio. […] First, you have to register IBM Academic Initiative with your academic instituion issued email. (e.g. …