WordPress Alt Temalarıyla Çalışmak İçin En İyi Rehberiniz

HeroThemes'te bizden satın aldığınız temaları özelleştirmek istiyorsanız, belki de kendiniz veya müşterileriniz için ısmarlama bir tasarım kullanarak web siteleri oluşturuyorsanız, WordPress alt temalarının gücünden yararlanabilmek ihtiyacınız olan bir şeydir.

En temelde, alt temaları kullanmak sizi daha verimli hale getirecektir - her proje için kullandığınız kodu kendi ana temanızda tutmak veya bizimki gibi hazır bir ana tema kullanmak, bağlı kaldığınız anlamına gelecektir. KURU (Kendini Tekrar Etme) ilkeleri.

Ancak daha da ileri götürülerek, çekirdek kod tabanlı site ağları oluşturmak için alt ve ana temaları kullanabilir, üçüncü taraf tema çerçevelerine dayalı özel temalar oluşturabilir veya tema çerçevesi olarak kullanmak üzere kendi gelişmiş ana temanızı bile oluşturabilirsiniz. . Bu makalede, çocuk temalarının temellerine hızlı bir genel bakış sunacağım ve ardından size daha gelişmiş bazı teknikler göstereceğim. Öğreneceksin:

• bir üçüncü taraf ana temasını veya tema çerçevesini projenizin ihtiyaçlarına uyarlamak için bir alt temanın nasıl kullanılacağı
• WordPress, ana ve alt temaların her birinde şablon dosyalarına nasıl öncelik verir?
• alt temanızın işlevler dosyasındaki ana tema işlevlerinin nasıl geçersiz kılınacağı.

Ebeveyn ve Çocuk Temalarını Anlama

Teorik olarak, bazıları bu rol için daha iyi tasarlanmış olsa da (bizimki de dahil!). Temalarımızdan birini kullanıyorsanız ve kendi projeniz için ince ayar yapmak istiyorsanız, bunu yapmak için ana temayı kesmek yerine bir alt tema kullanmak çok daha iyidir; bu, güncelleme yaptığınızda tüm değişikliklerinizi kaybedeceğiniz anlamına gelir. tema gelecek sürümlere. Bir alt tema oluşturmak için yeni bir tema oluşturmanız ve aşağıdakini stil sayfasının başına eklemeniz yeterlidir. Aşağıdaki örneğim, üst öğe olarak HeroThemes teması HelpGuru'yu kullanıyor, ancak KnowAll gibi başka bir HeroTheme ürünü de dahil olmak üzere herhangi bir temayı kullanabilirsiniz.

Bilgi Tabanınızı bugün oluşturmaya başlayın!

KnowAll temamız, bilgi tabanı sitenizi özelleştirmenize yardımcı olacak bir alt tema içerir

Temayı Alın

/*
Theme Name: My child theme
Theme URI: URL of the theme or site it's used for
Description: Description of what the theme is for and its main features.
Author: Your name
Template: helpguru
Version: 1.0
*/
@import url("../helpguru/css/style.css");

Önemli satırlar şu ikisi:

Template: helpguru
@import url("../helpguru/css/style.css");

İlk bölüm, WordPress'e bunun bir alt tema olduğunu ve üst öğesinin HelpGuru teması olduğunu söyleyen şablonu belirtir. Burada temanın adını değil, ana temanın klasörünün adını kullandığınızı unutmayın (bu nedenle yukarıda 'HelpGuru' değil 'helpguru' kullandım).

İkinci bölüm, stil sayfasını ana temadan içe aktarır; bu, ana temanın tüm stilinin alt temanızda etkinleştirileceği anlamına gelir. Daha sonra bu @import bildiriminin altına kendi stilinizi eklersiniz – bu, her iki temadan stilin kullanılacağı, ancak aynı öğe için her iki stil sayfasında bir bildirimin bulunduğu durumlarda, basamak nedeniyle alt temanın CSS'sinin geçerli olacağı anlamına gelir (alt temanızın stil, ana temadaki stilden sonra gelir).

Bir alt tema bir stil sayfasından oluşabilir ve dilerseniz başka hiçbir şeyden oluşmaz, bu durumda bunu yapmak için tek yapmanız gereken ana temanın bazı stillerini geçersiz kılmaktır. Alternatif olarak, fazladan şablon dosyaları ve/veya bir işlev dosyası ekleyebilirsiniz; bu durumda WordPress'in üst ve alt temalarınızdan şablon dosyalarına nasıl eriştiğini anlamanız gerekir.

Üst ve Alt Tema Şablon Dosyaları

WordPress'in üst ve alt temalarda şablon dosyalarını kullanma şekli oldukça basittir. Belirli bir sayfa (veya gönderi veya başka bir içerik türü) görüntülendiğinde, WordPress, şablon hiyerarşisine göre üst veya alt temadan en alakalı şablon dosyasını kullanır. Aynı şablon dosyasının iki versiyonunu bulursa, alt temadan olanı kullanır. Bu, alt temanızın şablon dosyalarının iki senaryoda ana temanın şablon dosyalarını geçersiz kılacağı anlamına gelir:

• alt temanız, hiyerarşide üst temadakilerden daha yüksek olan bir şablon dosyası içeriyorsa;
• veya ana ve alt temanızın her ikisi de gerekli şablon dosyasının bir sürümünü içeriyorsa.

Ana veya Alt Tema Şablon Dosyalarına Karar Verme

WordPress, hangi şablon dosyasının kullanılacağını belirlemek için şablon hiyerarşisini kullanır, ancak bu, ana ve alt temalarınızın her birinde sahip olduğunuz dosyalarla etkileşime girer. Basitçe söylemek gerekirse, WordPress üç adımdan geçer:

1. Görüntülenen içeriğin türünü tanımlar.
2. Bu içeriği üst veya alt temada görüntülemek için bir dosya bulana kadar şablon hiyerarşisi boyunca çalışır.
3. Dosya hem ana hem de alt temada mevcutsa, alt temadan olanı kullanır.

Bunu bir örnekle açıklayalım. Aşağıdaki tablo, biri diğerinin alt öğesi olan iki varsayımsal temadaki şablon dosyaları grubunu göstermektedir. Vurguladığım dosyalar önceliklidir.

Yukarıdaki örnekte, belirli içerik türlerini görüntülemek için hangi şablon dosyalarının kullanılacağına bakalım:

• 'Ürün' özel gönderi türü için tek gönderiler, alt temadan single-product.php kullanılarak görüntülenecektir.
• Diğer gönderi türleri (normal gönderiler dahil) için tek gönderiler, alt temadan single.php kullanılarak görüntülenecektir.
• Statik Sayfalar, ana temadan page.php kullanılarak görüntülenecektir.
• Widget kategorisine ilişkin listeler, alt temadan category-widgets.php kullanılarak görüntülenecektir.
• Diğer kategori listeleri, ana temadan category.php kullanılarak görüntülenecektir.
• Diğer arşiv listeleri, ana temadan archive.php kullanılarak görüntülenecektir.
• Arama sonuçları, ana temadan search.php kullanılarak görüntülenecektir.
• 404 sayfa, ana temadan 404.php kullanılarak görüntülenecektir.
• Belirli bir şablon dosyası olmayan diğer sayfalar, alt temadan index.php kullanılarak görüntülenecektir.

Daha İleriye Gitmek – Ana Tema İşlevselliğini Geçersiz Kılan

Bir ana temadaki CSS ve/veya şablon dosyalarını geçersiz kılmanın veya tamamlamanın yanı sıra, ana temadaki işlevselliği geçersiz kılmak veya ekstra işlevsellik eklemek için bir alt tema kullanabilirsiniz.

Uyarı! Alt temanızı yalnızca ekstra işlevsellik eklemek için kullanıyorsanız, bir eklenti yazmaktan daha iyi olabilirsiniz. Ne yazık ki üst ve alt temalardaki işlev dosyaları, stil sayfalarıyla aynı şekilde etkileşime girmez, aslında tam tersi şekilde çalışırlar (kafa karıştırıcı, biliyorum). WordPress, ana temanızdaki işlevleri alt temanızdan sonra çağırır, yani alt temanın işlevlerini geçersiz kılabilir. Kulağa biraz acı gibi geldiğini biliyorum: Sitenizde istediğiniz gibi bir alt tema oluşturdunuz, değil mi? Neyse ki, bunu aşmanın yolları var. İlk yöntem, alt temanızda kullandığınız yöntemdir ve bu, işlevlerinizi ilgili eyleme veya filtre kancalarına eklerken önceliği belirlemektir. İkincisi, ana temada yapılır ve bu, işlevlerinizi takılabilir hale getirmek içindir. Buna birazdan geleceğim ama önce alt temanızdaki yönteme bakalım.

Ana Tema İşlevselliğini Geçersiz Kılmak için Önceliği Kullanma

Alt temanıza eklediğiniz her işlevi etkinleştirmek için, onu bir eylem kancasına veya add_action() veya add_filter() kullanarak filtre kancasına eklemeniz gerekir. add_action() ve add_filter() işlevlerinin üç parametresi vardır:

• $tag – eylem veya filtre kancası için benzersiz tanımlayıcı
• $function_to_add – işlevinizin adı
• $priority - işlevinizi bağlamak istediğiniz öncelik (daha fazlası çok kısa sürede)

add_filter() ile dördüncü bir isteğe bağlı parametre olan $arguments kullanabilirsiniz, ancak bu özellikle alt temalarla ilgili değildir. Çoğu durumda yalnızca ilk iki parametre (her ikisi de gereklidir) kullanılır, ancak isteğe bağlı $priority parametresini, ana temadaki bir işlevi alt temanızdaki işlevle geçersiz kılmak için kullanabilirsiniz. Öncelik ne kadar yüksekse, o kadar geç yüklenir: varsayılan değer 10 , bu nedenle ana tema bir öncelik belirtmiyorsa, alt temanızdaki önceliği 10'dan yüksek bir sayıya ayarlamanız yeterlidir. Bunun nasıl olduğuna bir göz atalım. İşler. HelpGuru temasının bir çocuğuyla çalıştığınızı ve menü işlevselliğini geçersiz kılmak ve kendinizinkini eklemek istediğinizi hayal edin. Bu tema, after_setup_theme eylem kancasına eklenen temayı ayarlamak için (menüleri kaydetme, özellikli görüntü desteği ekleme ve daha fazlası dahil ht_theme_setup() işlevini içerir. HelpGuru'nun işlevler dosyasındaki kod aşağıdaki gibidir:

if ( ! function_exists( 'ht_theme_setup' ) ) :
function ht_theme_setup() {
// contents of function
}
}
add_action( 'after_setup_theme', 'ht_theme_setup' );

Alt ht_theme_setup() işlevinin öğelerini geçersiz kılmak için (hepsini değil: buna birazdan geleceğiz), HelpGuru tarafından sağlanan işlevselliğin öğelerini değiştiren bir işlev yazar ve onu after_setup_theme eylemine eklersiniz. kanca, 10'dan daha yüksek bir öncelik belirterek:

function my_theme_setup() {
// contents of function
}
add_action( 'after_setup_theme', 'my_theme_setup', 15 );

WordPress aynı kancaya bağlı bu işlevlerle karşılaştığında, önce düşük öncelikli olanı, yani ana temadan olanı tetikler. Ardından, alt temanızdan daha yüksek öncelikli olanı tetikler, yani işlevi ana temadan geçersiz kılabilir. Yukarıda bahsettiğim gibi, ana temalar olarak daha kolay kullanılabilmeleri için temalarınıza yazmak için iyi bir uygulama olan başka bir yöntem daha var ve bu, işlevlerinizi eklenebilir kılmak için.

Alt Temayı Geçersiz Kılmaya İzin Vermek için Takılabilir İşlevleri Kullanma

WordPress, ana temadaki işlevi alt temanızdaki işlevlerden sonra geçtiğinden, ana temanızın işlevlerini, alt temada aynı ada sahip bir işlevi kontrol etmeleri ve varsa, ana tema işlevi olmaması için kodlayabilirsiniz. geçti. Bunu, HelpGuru'da yukarıda gördüğümüze benzer bir koşullu ifadeyle yaparsınız:

if ( ! function_exists( 'ht_theme_setup' ) ) :
function ht_theme_setup() {
// contents of function
}
}

Aynı ada sahip bir fonksiyon daha önce geçilmemişse (örneğin alt temada), ana temanın fonksiyonu iletilecektir. Ancak WordPress bu ada sahip bir işlevle daha önce karşılaşmışsa, takılabilir işlevi (yani ana temadaki işlevi) yok sayar. Bunu yapmak için, alt temanızda, geçersiz kılmak istediğiniz ana temanızdakilerle aynı ada sahip işlevler oluşturmanız yeterlidir. Bu nedenle, ht_theme_setup() işlevini bütünüyle geçersiz kılmak için bunu alt temanızda kullanırsınız:

function ht_theme_setup() {
// contents of function
}

Bu kadar! Aynı ada sahip başka bir işlev yazmanız yeterlidir; bu, ana temadaki işlevi geçersiz kılar. Not: Bu teknik yalnızca kendi ana temanızı oluşturuyorsanız işe yarar – işlevler dosyasını üçüncü taraf bir ana temada düzenleyerek bunları takılabilir hale getirmeye çalışmayın. Sonuçta, bir çocuk teması yaratmanın asıl amacı, ebeveyne dokunmamanızdır!

Özet

Gösterdiğimi umduğum gibi, alt temalarla çalışmak, özellikle müşteriler veya kendiniz için özel siteler geliştiriyorsanız, bir WordPress geliştiricisi olarak verimliliğinizi ve etkinliğinizi artırabilir. En azından, HeroThemes'lerimizden biri gibi mevcut bir temanın alt temasını kullanmak, aynı işi tekrar tekrar yapmaktan kurtardığı için geliştirme iş akışınızı daha hızlı ve daha verimli hale getirebilir.

Ana temanın işlevselliğini geçersiz kılmak veya tamamlamak için alt temanın şablon dosyalarını ve işlevler dosyasını kullanarak bunu daha da ileri götürebilirsiniz. Alt temaları gerçekten en üst düzeye çıkarmak istiyorsanız, tüm yeni projeler için size hızlı bir başlangıç ​​noktası vererek ve sıfırdan başlamaktan daha az çabayla alt temalarınıza çok daha fazlasını eklemenize izin vererek kendi ana temanızı oluşturabilirsiniz. .