İçeriğe geç
Temalar

WordPress Alt Tema Stilleri Yüklenmiyor

Alt temanızın style.css dosyası yüklenmiyor çünkü WordPress bunu sizin için enqueue etmez. Alt temanın stil dosyası, elle kaydedilmek zorundadır

Yayınlandı

Alt temanızın style.css dosyası yüklenmiyor çünkü WordPress bunu sizin için enqueue etmiyor. Alt temanın stil dosyasının, alt temanın functions.php dosyasında elle kaydedilmesi gerekir ve bu enqueue neredeyse her zaman şu iki hatadan birini içerir: ya hiç yoktur ya da üst temanın stil dosyasını bağımlılık olarak belirtmeden yüklenir, böylece kurallarınız cascade içinde yanlış yere düşer ve geçersiz kılınır. Enqueue’yu düzeltin, stiller geri gelir. Muhtemelen 2013’ten kalma bir eğitimden kopyaladığınız eski @import numarası yanlış bir çözümdür.

Neden olur

Klasik bir alt tema, zorunlu iki dosyadan oluşur: üst temayı adlandıran bir başlık bloğu içeren bir style.css ve bir functions.php. Başlıktaki Template: satırı, WordPress’e şablonları hangi üst temadan devralacağını söyler. WordPress’in otomatik olarak yaptığı tek şey budur. Başlığı okur, şablon geri dönüşünü (fallback) bağlar ve durur. Ön yüzde alt temanızın style.css dosyasını asla enqueue etmez.

Üst tema ise kendi stil dosyasını kendi functions.php dosyasından, wp_enqueue_scripts hook’una bağlanmış şekilde enqueue eder. Sizin alt temanızın functions.php dosyası önce çalışır, sonra üst temanınki, sonra da o hook üzerindeki her şey tetiklenir. Alt temanız kendi dosyası için wp_enqueue_style çağrısını hiç yapmazsa, tarayıcı o dosyayı asla talep etmez. Sayfa, çıplak üst tema gibi görünür çünkü aynen o zaten.

İkinci arıza daha ince. Alt temanın stil dosyasını enqueue ediyorsunuz, yükleniyor, ama override’larınız hiçbir işe yaramıyor. Bu bir yükleme sırası (load-order) sorunudur. İki kuralın özgüllüğü (specificity) eşit olduğunda, en son yüklenen kazanır. Alt CSS’iniz üst temanınkinden önce yüklenirse, üst tema her berabere kalan durumu kazanır. wp_enqueue_style üzerindeki bağımlılık dizisi (dependency array), sırayı zorlayan şeydir.

İnsanların yanlış yaptığı bir şey daha: get_template_directory_uri() üst tema klasörünü işaret eder, get_stylesheet_directory_uri() ise aktif (alt) tema klasörünü işaret eder. Bunları karıştırırsanız, üst temanın style.css dosyasını ikinci kez enqueue eder ve alt temanınkine hiç dokunmazsınız.

Çözüm, sırasıyla

Önce, gerçekte neyin yüklendiğini teyit edin. Bozuk sayfayı açın, kaynağı görüntüleyin ve alt tema klasörünüzün adını arayın. WordPress, enqueue edilen stilleri <link id="handle-css" href="..."> olarak render eder — id, handle’ınız artı -css’tir. Alt temanızın style.css dosyası <head> içinde hiç yoksa, enqueue çalışmıyordur. Oradaysa ama stiller uygulanmıyorsa, bir bağımlılık/sıra sorunudur. Bu tek kontrol, iki hatadan hangisine sahip olduğunuzu söyler.

İkinci olarak, üst temanın gerçek handle’ını bulun. Çoğu modern tema (Astra, GeneratePress, Twenty-* temaları) kendi stil dosyalarını zaten belirli bir handle altında enqueue eder — astra-theme-css, generate-style-css, twenty-twenty-four-style gibi. Tam olarak o string’e ihtiyacınız var. Üst temayı grep’leyin ya da kaynağı görüntülerken <link id="...-css"> üzerinden okuyun (sondaki -css’i atın).

Üçüncü olarak, enqueue’yu yazın. Üst temanın kendi stil dosyasını zaten yüklediği yaygın durumda, üst temayı yeniden enqueue etmezsiniz. Yalnızca alt temayı enqueue edersiniz ve sizinki üst temadan sonra yüklensin diye üst temanın handle’ını bağımlılık olarak listelersiniz:

<?php
add_action( 'wp_enqueue_scripts', 'child_enqueue_styles', 20 );

function child_enqueue_styles() {
    wp_enqueue_style(
        'child-style',
        get_stylesheet_directory_uri() . '/style.css',
        array( 'astra-theme-css' ), // <-- the parent's REAL handle
        wp_get_theme()->get( 'Version' )
    );
}

Üst tema kendi stil dosyasını enqueue etmiyorsa (bazı eski veya minimal temalar @import’a dayanır), o zaman her ikisini de enqueue edin ve alt temanın üst temaya bağımlı olmasını sağlayın:

<?php
add_action( 'wp_enqueue_scripts', 'child_enqueue_styles' );

function child_enqueue_styles() {
    wp_enqueue_style(
        'parent-style',
        get_template_directory_uri() . '/style.css'
    );
    wp_enqueue_style(
        'child-style',
        get_stylesheet_directory_uri() . '/style.css',
        array( 'parent-style' ),
        wp_get_theme()->get( 'Version' )
    );
}

wp_get_theme()->get('Version') argümanı sizin cache-buster’ınızdır. Alt temanın style.css başlığındaki Version: satırını yükseltin, tarayıcılar dosyayı yeniden çeker. Bunu atlarsanız, CSS’i düzenler ve hiçbir şeyin değişmediğine yemin edersiniz — oysa sadece önbelleğe alınmıştır.

functions.php dosyasında bir sözdizimi hatası varsa, tüm dosya sessizce ölür ve enqueue’larınızın hiçbiri çalışmaz — bu da tam olarak “stiller yüklenmiyor” gibi görünür. WP_DEBUG’ı açın ya da debug.log dosyanızı WordPress hata günlüğü çözücümüze yapıştırıp fatal hatayı hızlıca tespit edin.

Yapılmaması gerekenler

@import kullanmayın. Codex döneminin tavsiyesi, alt temanın style.css dosyasının başına @import url("../parenttheme/style.css"); koymaktı. İşe yarar ama yavaştır — tarayıcı, alt CSS’i ayrıştırana kadar üst CSS’i indirmeye başlayamaz, dolayısıyla iki istek paralel yerine seri çalışır. WordPress’in kendi el kitabı yıllardır buna karşı tavsiyede bulunuyor. Eğitiminiz size bunu yapmanızı söylediyse, stillerinizin sorunlu olmasının nedeni o eğitimdir.

'parent-style' handle’ını sabit kodlayıp (hardcode) üst tema dosyasını körü körüne enqueue etmeyin. Meşhur Codex snippet’i tam olarak bunu yapar ve stil dosyasını zaten farklı bir handle altında kaydeden herhangi bir tema için yanlıştır. Üst CSS’i iki kez yüklersiniz ve bağımlılığınız var olmayabilecek bir handle’ı işaret eder.

wp_enqueue_style’ı functions.php’nin en üst seviyesinde çağırmayın. wp_enqueue_scripts’e bağlı bir fonksiyonun içinde çalışması gerekir. Çok erken çağrılırsa hiçbir işe yaramaz.

Üst temanın tüm functions.php dosyasını alt temaya kopyalamayın. İkisi de yüklenir; alt temanınki önce çalışır. Kopyalamak, çift fonksiyon bildirimlerine ve fatal bir hataya yol açar.

Bir uyarı: bunların hepsi klasik (PHP şablonlu) temalarla ilgilidir. Üst temanız bir block tema ise, stil çoğunlukla theme.json ve Site Editor üzerinden akar ve style.css override’ları farklı davranır — buna daha az güvenir, bu enqueue’nun çözüm olduğunu varsaymak yerine doğrudan test ederdim.

Hâlâ takıldınız mı?

Alt temanın style.css başlığındaki Template: satırının, üst temanın görünen adıyla değil, üst temanın klasör adıyla, büyük/küçük harfe duyarlı biçimde tam olarak eşleştiğini teyit edin. Sonra kaynağı görüntülemeyi tekrar kontrol edin: handle mevcut mu, üst temadan sonra mı yükleniyor, sürüm sorgu string’i yükseltilmiş mi. <link> oradaysa, en son yükleniyorsa ve CSS hâlâ uygulanmıyorsa, bu artık bir enqueue sorunu değildir — bir özgüllük (specificity) sorunudur ve çözüm kuralların kendisine geçer.