WordPress Çocuk Temaları: Temel Kavramlar için Tam Kılavuz
Bu haftanın makalesi, WordPress çocuk temaları hakkında WordPress’in geliştirilmesi için multimedya kılavuzumuz olan UP ve Running’den bir bölüm. Bu bölümün amacı, çocukların temalarının tüm temel kavramlarını bilmenizi sağlamaktır. Bu bölümü PDF olarak indirin, bu bölümü e-kitapların bir PDF’si olarak okumak istiyorsanız, lütfen buradan indirin. Zevk almak! Yukarı ve çalışır durumda çalışmaları hakkında, WordPress geliştirmenin tüm temel kavramları için bu bölümün ayrıntılı tartışmalarını sunuyoruz. Eğer ilgileniyorsanız, kontrol edin! Ve geçen haftaki alıcının tweet’ine katılıyoruz: Çit üzerinde “Yukarı ve Koşu” hakkında insanlar varsa, yapma! Videolar ve e-kitaplar yeni geliştiriciler için çok yararlıdır!
Ana paketler:
Çocuk Teması, mülklerinin çoğunu çıkarılan ana temadan devralan özel bir kayıtlı WordPress temasıdır. Bir çocuğun temasını yapmanın ana nedeni, istenen ayarlamayı kaybetmeden ana temayı güncellemektir.
Style.css, çocuk temasındaki tek zorunlu dosyadır. Genel kural, çocuk tema dosyasının varsa ana tema dosyası olmasıdır.
Çocuğun temasını doğru kullanmak için, style.css ana temasını nasıl ekleyeceğinizi bilmelisiniz; WordPress şablonu hiyerarşisinin çocuk temasına nasıl yanıt verdiğini; Ve hangi durumlarda function.php.
WordPress Children’ın teması, temanın kendisi çocuğun teması olmadığı sürece, zaten var olan diğer temalar şeklinde olabilen “ebeveyn” temasına bağlı bir WordPress temasıdır.
Çocuğun teması anne ile ilgili her şeyi miras aldı – ve sonra sadece değiştirilmesi gerekenleri değiştiriyor. Böylece, sadece ana tema stilinin sayfasını içe aktararak (daha sonra tartışacağız) ve başka değişiklikler yapmayarak, ebeveynle eş anlamlı bir çocuk teması hazırlayabilirsiniz. Neden bir çocuğun temasını kullanıyorsunuz? WordPress temasında değişiklik yaparsanız, temanızı güncelleyin, değişikliğiniz kaybolacaktır. Temalar genellikle güncellenir ve çok iyi nedenlerle: önemli yeni özellikler, hata iyileştirmeleri ve (özellikle) önemli güvenlik yamaları ve diğer nedenler. “Yalnızca bir kısmının” temasının (örneğin ticari temalar) değişiklik yaparsanız ve daha sonra temayı yeni bir sürüme güncellerseniz, değişiklikleriniz kaybolacaktır. Yalnızca oluşturduğunuz gerekli değişiklikleri yaparken, üst temanın aşağıda güncellenmeye devam etmesine izin verir. Var olmalarının ana nedeni budur. Bir çocuk temasıyla çalışmaya alışkın olduğunuzda, kullanmak için başka bir neden bulacaksınız: çok rahatlar. Mevcut temalara dalmak ve kabloyu çekmeye başlamak yerine yalnızca dosyaları (örneğin style.css veya function.php) temizlemeniz gereken değişiklikleri yazmak çok daha kolaydır. Yani çocukların temasına sadece gerekli değil, aynı zamanda iyi. Çocuk teması nasıl yapılır Bir çocuğun teması oluşturmak için yeni bir tema oluşturursunuz. Normal temalar (ana tema olabilecek temalar) gerekli iki dosyaya sahiptir: style.css ve index.php. Ancak, çocuğun temasının sadece bir tane vardır: style.css. Bunun nedeni, kusurları miras almalarıdır.
Çocuk temasını ve “şablon:”, Style.css’deki blok yorumlarında sıradan temalar gibi kayıtlı çocuk temalarının satırını kaydetmek. Ancak, yeni bir alan var: şablon :. Bu satır, her çocuk teması için ve üst temanın bulunduğu klasörün adına uygun olarak zorunludur. Aşağıdakiler çocuk temaları için bir yorum bloğu örneği:/* Tema Adı: Yirmi On Beş Çocuk Teması Uri: http://upandrunningwp.com/ Açıklama: Yirmi On beş Tema için Çocuk Teması Yazar: WPSHOUT YAZAR URI: HTTP: //wsphout.com/ şablon: TwentyFifteen Sürüm: 1.0.0 */ Bu, yeni tema klasöründeki style.css adresinde geçerlidir: Ve bu sonucu verir:
Büyütmek için tıklayın Bir kez daha, ana temanın “iyi isminin” yirmi on beş olduğunu, ancak yönetmenlerin adı yirmi beş olduğunu unutmayın. Şablondan sonra yazmamız gereken bu: İlginç Stil Sayfası Ebeveyn Teması Şimdi yirmi beş çocuk temasını etkinleştirirsek, sitemiz yirmi beş gibi görünmeyecektir. Tersine, mutlak bir felaket gibi görünecektir: Neden? Niye? Çünkü WordPress artık ana temadan stil.css dinlemiyor. Style.css çocuklar mevcut site için ana stil sayfasıdır ve içinde hiçbir şey olmadığı için site görülür (ve gerçekten!) Her şey şık değildir.
Bu sorunu çözmenin birkaç iyi yolu vardır; İki tartışacağız. Birinci seçenek: @Import Style.css Style.css çocuk temasının ana teması Bu ilk çözüm stilde bir satırdır. Daha iyi! Bu, stil dosyasının tüm içeriğini çekmek için @Import CSS’nin yönünü kullanır. Artık siteniz daha önce benziyor ve kendi tarzınızı aşağıya yazabilirsiniz. İkinci Seçenek: Enqueue Style.css Functions.php Çocuk Temasında Bu Çözüm Bu çözüm, Function.php’de Çocuk Temasından Function.php kullanır: / * Çevre: Function.php Ebeveyn yirmififteen * / Function wspspout_enqueue_twentyfifteen_stylesheet () {wp_enqueue_style (‘yirmiFifteen’, get_template_directory_uri (). ‘/style.css’); } Add_action (‘wp_enqueue_scripts’, ‘wphout_enqueue_twentyfifteen_stylesheet’); Burada dikkate alınması gereken bir şey, get_template_directory_uri () işlevinin kullanılmasıdır. Bu işlev, normal bir temaya çağrılırsa mevcut tema kök dizinini ve alt temaya çağrılırsa üst temanın kök dizini ifade eder. Bu işlevle, kendi temanızla mı yoksa ebeveyninizle mi konuştuğunuzu her zaman bilmiyorsunuz – genel olarak çok yararlı değil, ama burada ihtiyacımız olan şey bu, çünkü kesinlikle ebeveynle konuşmak istiyoruz. Neden style.css ebeveynini bu şekilde yükliyorsunuz? PHP rotası biraz daha hızlı çıktı, çünkü CSS @Imports ek sunucu isteklerini zorladı. Unutmayın, tarayıcınız, bir sunucu değil, @Import’un ne anlama geldiğini anlayabilir. Evet olduğunda, geri dönüp sunucudan – ikinci kez – @Import olması gereken stil sayfasını sormak zorunda kaldı. Bu performans farkı genellikle çoğu web sitesi ve barındırma ortamının çoğu için önemli değildir, bu nedenle bu yöntemlerden biri annenizi yüklemenin iyi bir yoludur. Bununla birlikte, daha iyi performansı nedeniyle, wp_enqueue_style () çözümü daha iyi bir kodlama uygulamasıdır, bu yüzden mümkünse kullanmanızı öneririz. Çocuk teması ve ana tema dosyası nasıl etkileşime girer. ebeveyn. Önemli sorulara daha yakından bakalım: Çocuğun tema dosyası hangi koşullar altında ana tema dosyasının yerini alır? Aşağıdakiler, çocuk temasının her bir kısmı için soruyu tanımlayan bir diyagramdır:
Büyütmek için tıklayın
Çoğu durumda, çocuğun tema dosyası yalnızca ebeveynlerde aynı ada sahip dosyalar bulunur. Çoğu durumda, çocuğun tema dosyası yalnızca ebeveynlerde aynı ada sahip dosyalar bulunur. İki önemli istisna:
WordPress şablonu hiyerarşisindeki dosyalar
Functions.php WordPress Şablon Hiyerarşisi’ndeki dosyalar Bir çocuk teması eklediğinizde, WordPress hala her zamanki gibi şablon hiyerarşisinden bir farkla adım atıyor: hiyerarşinin her adımında, önce alt temayı, sonra ana temada kontrol eder.
Şablon hiyerarşisini bir çocuk temasıyla geçmek: İlk örnek, bizim hakkımızda bir sayfa, bir sayfa türü görüntüleyeceğimizi söylüyor. Bu sayfa sümüklü ve kimlik 2’dir. Bu örnekte, ana temanın iki şablon dosyası vardır: Page.php ve index.php. Çocuk temalarının yalnızca bir şablon dosyası vardır: index.php. WordPress’in hangi şablonun görüntüleneceğine karar verir: Page- $ slug.php:
Çocuğun temasının page-anay.php adlı bir dosyası var mı? (Değil)
Üst temanın Page-anay.php adlı bir dosyası var mı? (Değil)
Page- $ id.php:
Çocuğun temasının Page-2.php adlı bir dosyası var mı? (Değil)
Üst temanın Page-2.php adlı bir dosyası var mı? (Değil)
Page.php:
Çocuğun temasının Page.php adlı bir dosyası var mı? (Değil)
Üst temanın Page.php adlı bir dosyası var mı? (Evet)
Bu durumda, WordPress sayfayı görüntülemek için ana tema sayfasını kullanacaktır. İkinci örnek şimdi aynı durumu hayal edelim, ancak çocuğun temasının da bir sayfası var.php:
Page- $ slug.php:
Çocuğun temasının page-anay.php adlı bir dosyası var mı? (Değil)
Üst temanın Page-anay.php adlı bir dosyası var mı? (Değil)
Page- $ id.php:
Çocuğun temasının Page-2.php adlı bir dosyası var mı? (Değil)
Üst temanın Page-2.php adlı bir dosyası var mı? (Değil)
Page.php:
Çocuğun temasının Page.php adlı bir dosyası var mı? (Evet)
Bu durumda, Page.php Çocuğun teması ebeveyninin yerini alacak ve WordPress sayfayı görüntülemek için alt sayfayı kullanacaktır. Function.php function.php çocuğun teması ebeveyninin önüne yüklenir. Functions.php çok özel bir durumdur: ana işlevinden önce yayınlanmıştır.php. Üst temanın nasıl yazıldığına bağlı olarak, bu iki farklı şekilde oynanabilir: Takılabilir fonksiyonlara sahip temalar, işlevin işlevini dikkatle kullanan ana temanın yazarı Ebeveyn temaları. PHP, Function_exists () adlı bir işlevi vardır. Tıpkı WordPress koşullu etiketi gibi, boolean döndürür – doğru veya yanlış aranacak işlevin aranmasına bağlı olup olmadığına bağlı olarak. (! Function_exists ()) {} IF’ye tüm işlevlerini dikkatlice saran ana temanın yazarı. Basit dilde, bu “işlev yoksa” anlamına gelir:! “Hayır” anlamına gelir, yani işlev varsa yanlış ve tam tersi doğru ise. Tema geliştiricisi bunu aşağıdaki gibi kullanıyor: / * Ana Teces’in Function.php * / // Yalnızca wpshout_filter_example () (! Function_exists (‘wpshout_filter_example’) {function: ‘. $ Title; } add_filter (‘the_title’, ‘wspout_filter_example’);
} if (! function_exists ()) takılabilir işlev olarak adlandırılanları kontrol edin. Bu, takılabilir işlev olarak adlandırılan şeyi yaratır: Function.php çocuk teması tarafından yazılabilen bir işlev. Çocuğun teması ona nasıl geldi? Sadece bu işlevleri kaydederek, çünkü çocuk işlevi.php önce çalıştırılır! Yani bir Child temasının yazarı şunları yazabilir: / * Çevre: Çocuk Teması’nın Fonksiyonları.php * / Function wspout_filter_example ($ title) {return ‘Child by Child! ‘. $ Title; } add_filter (‘the_title’, ‘wspout_filter_example’); Burada, wpshout_filter_example () çocuklar yürütülecek – ve ebeveyn olmayacak, çünkü! Function_exists (‘wspspout_filter_example’)! Function_exists (‘wpshout_filter_example’) artık false olarak değerlendirildi. Takılabilir işlevi kullanmayan bir ana tema ile nasıl çalışılır Bu durum, çocuk temasının yazarı için hayatı zorlaştırır. Aynı örneği ele alalım: Function.php Çocuk Teması, aynı zamanda function.php üst temasında olan wpshout_filter_example () adlı bir işlevi kaydeder. Çocuğun tema işlevi iyi kaydedilir. Ardından, Function.php Üst tema aynı adlı bir işlevi kaydeder. PHP bunu gerçekten sevmiyor. İşte yirmi on beş işlevi ve yirmi on beş çocuk temasını kullanan gerçek bir dünya örneği: Yirmi on beş işlevi beyan etmeye çalışmak, yirmififteen_widgets_init (), functions.php çocuk teması
Bu nedenle, üst tema bir function_exist () muayenesi yapmazsa, yinelenen işlevin adından herhangi bir şekilde kaçınmalısınız. Bu aynı zamanda, ana tema tarafından eklenen her özel PHP işlevinin yalnızca yürütülmesi gerektiği anlamına gelir. İşlevselliğin bir kısmını değiştirmek veya silmek istiyorsanız, istenmeyen Dequeue stil sayfası olan kendi işlevinizi yazarak manuel olarak, adım adım yapmalısınız. Şimdi öğrendiğimiz şey, çocuğun temasının temellerini ve nasıl ve neden kullanmayı biliyoruz. Mevcut temaları değiştirmek için, örneğin, müşterinin sitesindeki ticari temalar-çocuğun temasını sürekli olarak kullanacaktır, bu yüzden bu çok iyi bir bilgidir. Ve bu WordPress geliştirme sunum stilini seviyorsanız, geldiği ve çalıştığı yerden çok daha fazlası var. Her bölüm aynı zamanda esprili bir pantun ve sınavla da bitiyor, bu yüzden tartışalım! Çocuğun teması annesinden doğduğunda limerick’in bir özeti, aile bağları açıkça görülebilir: Taşma işlemleri hızlı bir şekilde verecektir, bu yüzden miras doğasında gelir.
Sınav zamanı!
Çocuğun teması var, böylece:
Temanın kendisi güncellendiğinde tema özelleştirmesi hayatta kalabilir
Teknik uzmanlığı olmayan kişiler temayı kolayca ayarlayabilir
Aşağıdaki temayı ebeveynin teması yapmak mümkündür:
Özel bir kodda var olan temalar
Function.php ile tema
Çocuk teması haline gelmeyen herhangi bir tema
Çocuk temasının yazarı, işlev, bir if (! Function_exist ()) {} içine sarılmayan üst temadaki işlevle aynıdır: o zaman:
Her iki işlev de gerçekleştirilecek
Hiçbir işlev gerçekleştirilecek ölümcül hatalara neden olmayacak
Cevaplar ve Açıklamalar
A. Tema güncellemesi genellikle gerekli güvenlik iyileştirmelerini ve yeni özellikleri sağlar ve bir çocuk teması verme süreci olmadan temanın özelleştirilmesini sağlar.
C. Ana tema için özel bir gereklilik yoktur;Ancak, “torunlar” teması yoktur.
C. PHP, yinelenen işlevin adını işleyemez.IF Sınavı (! Function_exists ()) {} ile çocuk temasının işlevi gerçekleştirilecek ve ana tema;Bu, çocuk temasının yazarının ana temanın işlevini seçici olarak değiştirmesine izin verir, bu nedenle (! Function_exists ()) {} genel olarak tema vermek için iyi bir uygulamadır.
Kredi görüntüsü: Allison
