WordPress'in get_template_part() İşlevi Hakkında Bilmeniz Gereken Her Şey

Yayınlanan: 2020-10-22

Bir keresinde programlamayı öğrenmenin en iyi yolunun başkalarının yazdığı kodu okumak olduğunu okumuştum. Sonuçta, bir geliştirici olarak harcadığınız zamanın çoğu, muhtemelen sizin veya başka bir geliştiricinin geçmişte yazdığı kodu gözden geçirecek, cilalayacak ve düzeltecektir. İşte tam da bu yüzden özgür ve açık kaynaklı yazılımları bu kadar çok seviyorum: bize harika araçların kaynak kodlarına erişim sağlıyor ve onlardan öğrenmemizi mümkün kılıyor.

WordPress dünyasıyla ilgileniyorsanız (ve burada olduğunuzu hayal ediyorum, çünkü buradasınız), WordPress Core'un kaynak kodu veya Gutenberg'in kaynak kodu, daha iyi bir WordPress uzmanı olmanın ve arka uç ve ön uç geliştirme hakkında bilgi edinmenin iki çok iyi yoludur.

Gutenberg'in ilk sürümünden bu yana, şu ana kadar ön uç geliştirme hakkında öğrendiğimiz her şeyi paylaşıyoruz. Bu nedenle, örneğin, size React'in temellerini öğrettiğimiz, bileşenlerin nasıl yeniden kullanılacağını gördüğümüz, Gutenberg'in nasıl genişletileceğini açıkladığımız ve daha iyi kaynak kodu yazmak için JavaScript haberlerini tartıştığımız bir dizi gönderi yaptık. yazdık.

Pekala, bugün vites değiştirip tekrar WordPress Core'a odaklanacağız. Niye ya? Bilmiyorum, belki de birkaç gün önce çıkan bir sonraki Twenty Twenty-One temasının duyurusu bunu yapmak için mükemmel bir bahane olduğu için mi? Öyleyse WordPress'te tema oluştururken en önemli unsurlardan biri hakkında konuşalım: get_template_part işlevi.

Panda bilgisayarında gördüklerinden korkar
Merak etme! Yavaştan alalım.

WordPress Temaları

Her şeyden önce, WordPress temalarının nasıl çalıştığını gözden geçirelim, olur mu? Temel olarak tema, sitemizin kullanacağı HTML yapısını ve CSS stillerini tanımlayan bir dosya koleksiyonudur.

Herhangi bir web sayfasının iskeletini düşünürseniz, aynı kalıbın her zaman tekrarlandığını göreceksiniz:

  • html ve head etiketlerini açarak başlıyoruz. Komut dosyalarını, stilleri, meta etiketleri vb. eklediğimiz yer burasıdır.
  • Ardından head etiketini kapatıyoruz ve web sitemizin görünen içeriğini içerecek olan body etiketini açıyoruz.
    • Genellikle bir sayfanın gövdesi, web logosu, menü vb. içeren bir başlık içerir.
    • Ardından, bir sayfa, bir blog makalesi, bir gönderi listesi, bir aramanın sonucu vb. olabilen içeriğin kendisi gelir.
    • Son olarak, genellikle bir altbilgi ile biter.
  • Son olarak, tüm sayfa oluşturulduktan sonra tüm etiketleri kapatıyoruz ve işimiz bitti.

Yani, evet, öyle görünüyor ki, her web sayfası aşağı yukarı benzer bir yapı izliyor: ortak bir kısım (yani üstbilgi, menü, altbilgi…) ve içeriğe özel bir alan (bir blog yazısı, bir aramadan sonra elde ettiğimiz sonuç kümesi) var. , bir WooCommerce ürünü vb.)

Programcılar kodu tekrarlamayı sevmediğinden ve (genel olarak) organize insanlar olduğumuzdan, WordPress temaları çok desenli bir dosya yapısını takip eder. Birkaç ay önce yazdığım bu yazıda, bir temadaki farklı dosyalar hakkında iyi bir açıklamanız var, ancak şunu unutmayın:

  • bir stil sayfası: style.css ,
  • web sayfasını "açmak" için bir header.php dosyası (yani, head etiketinin çıktısını ve normalde, tüm sayfalarda ortak olan body ilk bölümünü),
  • sayfayı "kapatan" başka bir footer.php dosyası (yani, altbilgiyi ekler ve html etiketini kapatır) ve
  • oluşturmak istediğimiz farklı içerik türleri için birçok ek dosya.

get_template_part işlevi nedir ve ne işe yarar?

Yeni bir özellikle karşılaştığınızda yapacağınız ilk şey, babanız yeni Roomba temizleyicisini programlamanıza yardım etmenizi istediğinde yaptığınızın tam tersidir: belgeleri okuyun. Öyleyse bunu Codex'e bakarak fonksiyonumuzla yapalım:

get_template_part , alt temaların temadaki yeniden kullanılabilir kod bölümlerini aşırı yüklemesi için basit bir mekanizma sağlar.

Bir tema için adlandırılmış şablon bölümünü içerir veya bir ad belirtilirse özel bir bölüm dahil edilir. Tema {slug}.php dosyası içermiyorsa, şablon dahil edilmeyecektir.

Şablon, require_once değil, require kullanılarak eklenir, bu nedenle aynı şablon parçasını birden çok kez dahil edebilirsiniz.

$name parametresi için, dosyanın adı “{slug}-special.php” ise “özel”i belirtin.

Not: get_template_part() sessizce başarısız olur

get_template_part belgeleri WordPress.org'da

Görmek? Bir dakikadan kısa bir sürede ihtiyacımız olan tüm bilgileri aldık. Artık bu işlevin bir temada "tekrar kullanılabilir parçalar" oluşturmak için kullanıldığını (böylece kodun kopyalanmasından kaçınıldığını) biliyoruz ve bunu bir alt temanın bunları uyarlayabileceği şekilde yapıyor. Ayrıca parametreleri, dahili işleyişi (PHP'nin require işlevini kullanır) ve ondan ne bekleyebileceğimiz ("sessizce başarısız olur") hakkında da bilgimiz var.

Mutlu bir adam çizgi film

Ne yazık ki, bahsettiği bu {slug}.php ve {slug}-special.php dosyaları gibi hala belirsiz olan birkaç şey var. Onlar neler? Ne içerirler? Onlar ne yapar? Yalnızca belgelere bakarak yanıtlanması zor birçok soru var, bu nedenle örneklere geçmenin zamanı geldi.

Temamızda kısmi şablonlar nasıl oluşturulur?

Bu "kısmi şablonları" kullanıp kullanmadığını ve kullanıyorsa neye benzediğini ve bunları kendi temanızda uygulamak için ne yapmanız gerektiğini öğrenmek için Twenty Twenty-One temasına bir göz atalım.

Bir WordPress temasının dosya hiyerarşisi hakkındaki yazımı okursanız, “ index.php için varsayılan şablondur. Söz konusu içeriğin kendisi için tasarlanmış belirli bir şablonu olmadığı sürece, web sitemizdeki herhangi bir içeriği oluşturmak için kullanılır.” Bu varsayılan bir şablon olduğundan, oradan başlamanın iyi bir fikir olduğunu düşünüyorum. Bu, Twenty Twenty-One temasındaki index.php içeriğidir:

 get_header(); if ( have_posts() ) { // Load posts loop. while ( have_posts() ) { the_post(); get_template_part( 'template-parts/content/content' ); } // Previous/next page navigation. twenty_twenty_one_the_posts_navigation(); } else { // If no content, include the "No posts found" template. get_template_part( 'template-parts/content/content-none' ); } get_footer();

Gördüğünüz gibi, daha önce yorumladığımız tüm bölümlere sahibiz:

  • get_header kullanan başlığı içerir.
  • İçeriğin kendisini oluşturur.
  • Sayfayı get_footer ile kapatır.

Buradaki ilginç şey, açıkçası, index.php içindeki "içerik" alanıdır. Spesifik olarak, geçerli bir içerik görüp görmediğimizi bilmek için küçük bir kontrolümüz olduğunu görüyoruz (WordPress Döngüsünün have_posts işlevi) ve sahip olup olmamamıza bağlı olarak kısmi bir şablon ( …/content ) veya başka bir ( …/content-none ).

Şimdi kısmi content.php şablonuna bir göz atarsak, kabaca aşağıdakileri göreceğiz:

 <article <?php post_class(); ?>> <header class="entry-header alignwide"> … the_title( … ); … </header> <div class="entry-content"> <?php the_content( … ); wp_link_pages( … ); ?> </div> <footer class="entry-footer default-max-width"> <?php twenty_twenty_one_entry_meta_footer(); ?> </footer> … </article>

Oldukça basit, değil mi? Tek sahip olduğumuz, örneğin bir blog yazısı gibi genel WordPress içeriğini oluşturmak için tasarlanmış küçük bir şablon. Ortaya çıkan HTML iskeletinin, gerçek içeriği çekmek için tümü WordPress şablon etiketlerini kullanan bir başlık, içerik ve altbilgi içeren bir article etiketinden başka bir şey olmadığını unutmayın.

WordPress API'si neden harika?

Tüm bu işlevlerin ( get_header , get_footer veya bugünün yıldızı: get_template_part ) var olduğunu bilmiyor olsanız bile, benzer bir yaklaşım izleyerek kodunuzu düzenleyeceğinizden oldukça eminim. Sonuçta, başlık için bir şablon, alt bilgi için başka bir şablon, içerik için başka bir şablon oluşturmak oldukça mantıklı görünüyor… ve sonra özel bir dosyaya veya hepsini birbirine yapıştıran bir şeye sahip olmak, değil mi?

Böyle bir yaklaşımı izlediyseniz, bahse girerim index.php dosyanız şöyle görünürdü:

 require_once 'header.php'; if ( have_posts() ) { // Load posts loop. while ( have_posts() ) { the_post(); require 'template-parts/content.php'; } // Previous/next page navigation. twenty_twenty_one_the_posts_navigation(); } else { // If no content, include the "No posts found" template. require 'template-parts/content-none.php'; } require_once 'footer.php';

bu da Twenty Twenty-One temasındakine çok benziyor. Bu noktada kendinize şunu sorabilirsiniz: Belirli WordPress işlevlerini kullanarak ne kazanırım? Özellikle WordPress belgelerine göre bu yardımcı işlevlerin tam olarak bu amaçla kullanıldığını göz önünde bulundurarak, bir PHP require öğesini doğrudan kullanmakla aynı şey değil mi?

Ana neden aslında belgelerin kendisinde belirtilmiştir: alt tema oluşturmayı kolaylaştırır. Bu nedenle, bir alt tema oluşturuyorsanız ve get_template_part , WordPress alt öğedeki şablonu arayacaktır ve değilse, ebeveyninkini kullanacaktır.

Ama hepsi bu değil! WordPress işlevleri genellikle nihai sonucu uyarlamanıza izin veren filtreler ve eylemlerle doludur. Örneğin, wp-includes/general-template.php dosyasındaki get_template_part dahili işlevine bakarsak:

 function get_template_part( … ) { do_action( "get_template_part_{$slug}", … ); … do_action( 'get_template_part', … ); if ( ! locate_template( … ) ) { return false; } }

Eklentilerin ve temanın kendisinin kullanabileceği birkaç eylemimiz olduğunu göreceğiz. Ve konuyu açmaya devam edersek, WordPress'in nasıl konumlandığını ( locate_template ) ve sonunda kullanacağı şablonu nasıl yüklediğini bile görebiliriz:

 function locate_template( $template_names, … ) { $located = ''; foreach ( $template_names as $name ) { if ( file_exists( STYLESHEETPATH . "/$name" ) ) { $located = …; // in child theme break; } else if ( file_exists( STYLESHEETPATH . "/$name" ) ) { $located = …; // in parent theme break; } else { … } } if ( $located ) { load_template( $located, $require_once, $args ); } return $located; }

Umarım bugünkü gönderi, WordPress temalarının nasıl çalıştığını biraz daha iyi anlamanıza yardımcı olmuştur. Ayrıca, belgelerini okuyarak ve kaynak koduna göz atarak WordPress hakkında nasıl bilgi edineceğinizi de gösterdiğini umuyorum. Ve beğendiyseniz, arkadaşlarınızla paylaşın ve bize bir yorum bırakın.

Unsplash'ta Joshua Sortino'nun öne çıkan görseli.