WordPress sitenizin hızını artırmak ve gereksiz kaynak tüketimini azaltmak istiyorsanız, Gutenberg blok CSS dosyalarını kaldırmak size ciddi avantaj sağlar. Özellikle klasik editör kullanan ya da özel temalarla çalışan siteler için bu dosyalar hem yükleme süresini uzatır hem de görünüm sorunlarına neden olabilir. Bu yazıda neden kaldırmanız gerektiğini, nasıl kaldırıldığını ve dikkat etmeniz gereken noktaları anlatıyorum.

Gutenberg CSS Nedir?

WordPress’in klasik editöründen sonra gelen Gutenberg blok editörü, içerikleri bloklar halinde oluşturmanıza olanak sağlıyor. Metin, görsel, buton, galeri gibi her bir içerik öğesi ayrı bir blok olarak çalışıyor. Bu blokların düzgün görünmesi için WordPress, arka planda bazı Gutenberg CSS dosyaları yüklüyor. Bunlara genel olarak wp-block-library.css ve wp-block-library-theme.css gibi dosyalar dahil.

Eğer sitenizde bu blokları kullanıyorsanız bu CSS dosyaları işe yarıyor. Ama mesela siz sadece klasik editör kullanıyorsanız, ya da tamamen özel bir tema geliştiriyorsanız, bu CSS dosyaları boşa yüklenmiş oluyor. Yani sayfa her açıldığında gereksiz stil dosyaları da kullanıcıya gönderiliyor.

Bu da ne demek? Daha fazla veri, daha geç açılan sayfa, bazen bozulan tasarım, daha düşük site hızı puanı. Özellikle Google PageSpeed Insights gibi araçlarda sitenizi test ettiğinizde karşınıza “kullanılmayan CSS kaldırılmalı” gibi uyarılar çıkabilir. Bu da doğrudan SEO'yu etkileyen bir faktör.

Ben de kendi blogumda Gutenberg bloklarını hiç kullanmadığım halde bu CSS’lerin yüklendiğini fark ettim. İlk başta önemsememiştim ama site hızımda 5-6 puanlık bir fark görünce konuyu biraz araştırdım. Meğer bu dosyaları kaldırmak gayet basitmiş.

Gereksiz CSS Dosyaları WordPress Site Hızını Nasıl Etkiliyor?

WordPress bir sayfayı yüklerken, tema dosyalarıyla birlikte bazı ekstra stil dosyaları da çağırıyor. İşte bu dosyaların arasında Gutenberg blok CSS’leri de var. Eğer sitenizde bu blokları aktif olarak kullanmıyorsanız, bu CSS’ler boşuna yüklenmiş oluyor.

Sayfa açılırken tarayıcı her bir CSS dosyasını indiriyor, işliyor ve sonra kullanıcıya içeriği gösteriyor. Gereksiz bir dosya bile bu süreci uzatabiliyor. Özellikle mobil kullanıcılar için bu fark daha da belirgin. Yani 20-30 KB’lık bir stil dosyası bile ilk içerik gösterme süresini (First Contentful Paint) geciktirebiliyor.

Google’ın PageSpeed Insights ya da Lighthouse gibi analiz araçlarında, bu stil dosyaları genelde şöyle görünüyor:

  • Avoid chaining critical requests
  • Remove unused CSS
  • Reduce unused JavaScript

Eğer burada wp-block-library.css gibi bir dosya listeleniyorsa, bu dosya sitenizin hızını negatif etkiliyor olabilir. Bu da demek oluyor ki kullanıcılar sayfanıza girdiğinde, içerik daha yavaş yükleniyor. Google da bu durumu fark ediyor ve sıralamada sizi bir adım geriye atabiliyor.

Ben kendi sitemde bu dosyaları kaldırdıktan sonra mobil puanlarımda 10 puana yakın bir artış görüyorum. Sayfa daha hızlı açılmaya başlıyor. Yani sadece estetik değil, performans açısından da fark yaratıyor.

WordPress’te functions.php Dosyası ile Gutenberg CSS Nasıl Kaldırılır?

Gutenberg’in yüklediği CSS dosyalarını kaldırmak aslında düşündüğünüzden daha kolay. Tek yapmanız gereken, temanızın içindeki functions.php dosyasına küçük bir kod eklemek. Bu kod sayesinde WordPress’e "Bu dosyaları artık yükleme" diyorsunuz.

Aşağıdaki kodu temanızın functions.php dosyasının en altına ekleyebilirsiniz:

function remove_gutenberg_block_css() {
  wp_dequeue_style( 'wp-block-library' );
  wp_dequeue_style( 'wp-block-library-theme' );
  wp_dequeue_style( 'wc-block-style' ); // WooCommerce kullanıyorsanız
}
add_action( 'wp_enqueue_scripts', 'remove_gutenberg_block_css', 100 );

Bu kod ne yapıyor?

  • wp-block-library: Gutenberg’in temel blok stil dosyasını kaldırıyor.
  • wp-block-library-theme: Tema ile ilgili ek Gutenberg stillerini kaldırıyor.
  • wc-block-style: WooCommerce varsa, onun blok CSS’lerini de kaldırıyor.

Kodun en altındaki add_action(...) satırı ise bu işlemi sayfa yüklenirken otomatik olarak devreye sokuyor. Küçük bir dokunuş ama sayfa performansını hissedilir şekilde iyileştiriyor.

Gutenberg Bloklarını Kullanmayanlar için CSS Kaldırma Mantıklı mı?

Kısa cevap: Evet, hem de fazlasıyla. Eğer sitenizde sadece klasik editör kullanıyorsanız ya da içeriklerinizi tamamen özel alanlar (custom fields) veya farklı editörlerle oluşturuyorsanız, Gutenberg’in CSS dosyaları size hiçbir fayda sağlamıyor. Sadece sayfa yüklenirken gereksiz yük oluşturuyor.

Sonuç

Gutenberg blok CSS’lerini kaldırmak, WordPress sitenizde daha hızlı yüklenen, daha temiz kod yapısına sahip ve SEO açısından daha avantajlı sayfalar oluşturmanızı sağlar. Eğer blok editör kullanmıyorsanız ya da özel bir tasarıma sahipseniz, bu basit adımla sayfa performansınızı hissedilir şekilde iyileştirebilirsiniz.