Blok Düzenleyici (Gutenberg) Nedir?
Kısa tanım
Blok düzenleyici (Gutenberg), WordPress 5.0 ile varsayılan düzenleyici olan ve içeriği paragraf, başlık, görsel, düğme veya sütun gibi bağımsız bloklardan kuran düzenleme arayüzüdür. Bloklar, yazı içeriğinde HTML yorum işaretleriyle ayrılmış biçimde saklanır. Aynı blok yapısı, blok desenleri (patterns) ve blok temalarıyla birlikte Site Düzenleyici'de üst bilgi, alt bilgi ve şablonların düzenlenmesinde de kullanılır; bu yaklaşım Full Site Editing olarak bilinir.
Diğer adları: Gutenberg, Block Editor, WordPress blok editörü, Full Site Editing, FSE, Site Düzenleyici
Tek metin kutusundan bloklara
WordPress 5.0'a kadar içerik, tek büyük bir metin kutusundan oluşan klasik düzenleyiciyle girilirdi. Sütun, düğme veya galeri gibi düzenler için kısa kodlara (shortcode) ya da sayfa oluşturucu eklentilerine başvurmak gerekiyordu. Aralık 2018'de yayımlanan WordPress 5.0 ile proje adı Gutenberg olan blok düzenleyici varsayılan hâle geldi. Bu modelde her içerik parçası kendi ayarları olan ayrı bir bloktur: paragraf, başlık, görsel, alıntı, tablo, sütun grubu. Eski düzenleyiciyi tercih edenler için resmî Classic Editor eklentisi hâlâ mevcuttur.
Bloklar veritabanında nasıl saklanır?
Blok düzenleyici ayrı bir veri formatı kullanmaz. Resmî belgelere göre bloklar, HTML yorumlarıyla sınırlandırılmış normal HTML olarak saklanır:
<!-- wp:heading {"level":2} -->
<h2 class="wp-block-heading">Kargo süreleri</h2>
<!-- /wp:heading -->
<!-- wp:latest-posts {"postsToShow":4} /-->İlk blok statiktir: HTML çıktısı kaydedildiği anda üretilir ve veritabanında durur. İkincisi dinamiktir: yalnızca ayarlarını içeren bir yorum saklanır, HTML ise her sayfa isteğinde sunucuda üretilir. Bu ayrımın pratik bir sonucu vardır: bir eklentiye ait statik bloğun içeriği, eklenti kaldırılsa bile HTML olarak okunmaya devam eder; dinamik blok ise eklentiyle birlikte sayfadan kaybolur.
Desenler, şablonlar ve Full Site Editing
Blok desenleri, önceden yapılandırılmış blok gruplarıdır: bir fiyat tablosu, bir “ekibimiz” bölümü ya da hazır bir iletişim alanı. Eşitlenmemiş (unsynced) bir desen eklendiği yere bağımsız bir kopya olarak yerleşir; eşitlenmiş (synced) desende ise tek bir değişiklik desenin kullanıldığı her yerde görünür.
Blok yapısı yalnızca yazı içeriğiyle sınırlı değildir. Etkin tema bir blok teması ise Görünüm > Düzenleyici yolundan açılan Site Düzenleyici ile üst bilgi, alt bilgi, arşiv ve 404 gibi şablonlar, menüler ve sitenin genel stilleri de bloklarla düzenlenebilir. Bu yaklaşım Full Site Editing (FSE) adıyla anılır ve yalnızca blok tabanlı WordPress temalarında kullanılabilir.
Geliştirici açısından blok düzenleyici
Editör arayüzü React ile yazılmıştır; özel bir blok geliştirmek, editörde nasıl görüneceğini tanımlayan bir JavaScript bileşeni ve meta verileri tutan bir block.json dosyası yazmayı gerektirir. Dinamik bloklarda çıktı PHP ile sunucuda üretilir. Özel içerik türlerinin blok düzenleyicide açılabilmesi için de kayıt sırasında REST API desteğinin etkinleştirilmesi gerekir; bu ayrıntı WordPress maddesindeki örnekte gösteriliyor.
Sayfa oluşturuculardan farkı ve dikkat edilecekler
Birçok sayfa oluşturucu içeriği kendi kısa kodları veya özel veri yapısıyla saklar; araç kaldırıldığında sayfalar okunamaz hâle gelebilir. Blok düzenleyici ise çekirdeğin parçasıdır ve çıktısı standart HTML'dir. Buna karşın görsel serbestlik genellikle daha sınırlıdır ve karmaşık düzenler için doğru desen ve bloklarla çalışmak gerekir.
İçerik kalitesi açısından en sık hata, başlık bloklarını görünüm için kullanmaktır. Bir metni büyük göstermek için H2 seçmek, sayfanın başlık hiyerarşisini bozar. Başlık seviyesi içeriğin yapısına göre, boyut ise stil ayarlarıyla belirlenmelidir; bu, anlamsal HTML ilkesinin editördeki karşılığıdır.