WP Enqueue Nedir ve Nasıl Kullanırsınız?

Yayınlanan: 2017-10-28

HTML'yi ilk öğrendiğinizde, herhangi bir etkileşim türünü nasıl ekleyeceğinizi bilmenin tek yolu, harici bir JavaScript dosyasının türünü ve kaynağını ayarlamak için sayfanın üstbilgi veya altbilgisinde komut dosyası etiketlerini kullanmaktır. (Ya da gerçekten yeni öğreniyorsanız, tüm JS işlevi, tam orada gövdede bulunan komut dosyası etiketleri arasında çalışır. Bu, öğrenmek için iyidir, ancak gelişmiş WordPress geliştirmesine geçtiğinizde oldukça kötü bir uygulamadır. Sıralama işlevine girin.

Basit, tek sayfalık web sitelerini geçtikten sonra, bu başlangıç ​​uygulamaları gerçekten zor durumlar yaratabilir. Gittikçe daha fazla JavaScript eklemeye başladığınızda, web siteniz daha da yavaşlar. Güncellemek daha uzun sürer. Sonunda, büyük bir JavaScript-getti yığını yaptınız ve ne kadar denerseniz deneyin, bu erişte yığını çözülmeyecek.

Neyse ki, CMS'nin sizin için ilgileneceği stiller ve komut dosyaları eklemek için WordPress'teki kuyruğa alma işlevini kullanabilirsiniz. Tüm dağınıklık sizin için halledilir. İstediğiniz komut dosyasını veya stilleri her sayfanın üstbilgisine veya altbilgisine doğrudan yapıştırmak kadar basit olmasa da, bunu ele almanın doğru yolu budur. WordPress çok düşünceli değil, kesinlikle bilmeniz gereken bir dizi en iyi uygulama var.

Ve wp_enqueue_scripts bu uygulamaların başında geliyor.

Sorun ne?

wp_enqueue kullanmak isteyeceğiniz birincil neden, sitenizin sorunsuz ve hızlı bir şekilde çalışmasını sağlamaktır. Sayfa hızı önemlidir ve aynı komut dosyalarını ve stilleri tekrar tekrar kullanmak yardımcı olmaz. Hiç.

Neyse ki, wp_enqueue işlevsel programlamanın bir örneğidir. Bunun anlamı, yürütülecek tek bir kod parçası (JavaScript snippet'iniz) yazmanız ve her ihtiyacınız olduğunda her şeyi yeniden yazmak/yapıştırmak yerine wp_enqueue'yi çağırmak için kullanmanızdır.

Bu. Mükemmel.

Daha da harikası, kuyruğa alma yöntemini kullanmak, WordPress'in _script_ etiketlerini otomatik olarak ait oldukları üstbilgi ve altbilgiye eklemesini ve her sayfaya ayrı ayrı girmek zorunda kalmadan yüklemesini sağlar.

WP Enqueue Sözdizimi ve Paramlar

Komut dosyalarını kuyruğa almak gerçekten o kadar zor değil. İlk etapta JavaScript ile çalışacak kadar bilgiliyseniz, kuyruğa almak için kullandığınız PHP işlevleri çocuk oyuncağı olacaktır.

Tipik bir komut dosyası etiketinde, harici .js dosyasını doğrudan içe aktarırsınız veya uzun kod parçacığının tamamını etiketlerin arasına yapıştırırsınız. (Ayrıca Divi kod modülüne veya WP Özel HTML veya Metin widget'larına bir şey yapıştırırsanız yaptığınız şey budur).

Sadece birkaç temel parametreyi ve söz dizimini bilmeniz yeterlidir.

Codex bunu temel kuyruğa alma kodu olarak verir: 

wp_enqueue_script( $handle, $src, $deps, $ver, $in_footer );

Sonuç olarak, parametrelere göre kullanılabilir bitlere bölmek oldukça basittir.

  • wp_enqueue_script() , tüm kodu gideceği sayfaya koyacak olan işlevdir.
  • $handle , betiğin kendisi için benzersiz bir addır.
  • $src , sıraya aldığınız gerçek .js dosyasının URL'sini temsil eder.
  • $deps , bunun gerektirdiği tüm bağımlılıkların $handle ' larıdır .
  • $ver sürüm numarası olacaktır. Hiçbiri belirtilmemişse, WP kurulum sürümünün otomatik olarak eklenmesini sağlarsınız.
  • $in_footer veya $in_header , WordPress'e komut dosyanızı nereye koyacağınızı söyler.

Komut dosyalarını kuyruğa almak için tam belgeler Codex'te görülebilir.

Dikkat, Öğrenciler: WP Kayıtları Şimdi Başlıyor!

_wp_enqueue__'ye ek olarak, WP'nin _wp_register__ adlı kullanışlı bir yöntemi de vardır. Her iki yöntem de aynı parametreleri ve sözdizimini kullanır, bu nedenle ikisiyle gerçekten bire bir anlaşma elde edersiniz. Temel olarak, bir komut dosyasını kaydetmek, JavaScript'te bir işlevi adlandırmakla aynıdır.

Gerekli olmasa da, komut dosyalarınızı kaydettirmek hayatınızı çok daha kolaylaştırabilir çünkü daha sonra bunları bağımlılık olarak bildirmek zorunda kalmayacaksınız. Zaten kayıtlı olacaklar. Bu nedenle…_wp_register__. Bir betik kaydedildikten sonra, aşağıdaki örnekte göreceğiniz gibi, onu $handle ile geri çağırabilirsiniz.

Kodunuzu şu şekilde kaydedeceksiniz: 

wp_register_script( 'jquery', 'http://ajax.googleapis.com/ajax/libs/jquery/1.10.1/jquery.min.js', false, null, $in_footer);

Ardından, tekrar ihtiyacınız olduğunda, her zaman şu şekilde geri arayabilirsiniz:

wp_enqueue_script( 'jquery' );

Ek olarak, kayıt, gerekli olmadığında bile bir komut dosyası yüklemeniz gerekmediği anlamına gelir. WPMU'nun harika bir kısa kod oluşturma örneği vardır: komut dosyasını _wp_enqueue__ kullanan bir kısa koda kaydederseniz, yalnızca kısa kod olduğunda kullanılır. Ancak sadece kuyruğa alarak çağırırsanız, kısa kod kullanılmasa bile yüklenecektir.

Yöntemle ilgili her şeyi Codex'te okuyabilirsiniz.

Ek olarak, eklenti yazarlarının WordPress.org deposuna dahil edilmelerini istiyorlarsa komut dosyalarını kuyruğa almaları gerekir, bu nedenle bu sizin plakanızdaysa… sıraya girseniz iyi olur.

Bir araya getirmek

Kodu uygulamak kolaydır. Function.php dosyanızın içine aşağıdakine benzer bir pasaj bırakmanız yeterlidir. ve WordPress gerisini halleder. Demek istediğim, bu, jQuery'yi çağırmak için gerçekten basit bir snippet, ancak öğelerin birlikte nasıl oynadığını görebilirsiniz.

Normalde şuna benzeyen bir şey kullanırsınız: 

<script type="text/javascript" src="jquery.js"></script>

enqueue_scripts_ nasıl kullanıldığını öğrendikten sonra, buna benzer bir şey daha göreceksiniz: 

add_action('wp_enqueue_scripts', 'add_scripts');
function add_scripts(){
    wp_register_script( 'jquery', 'http://ajax.googleapis.com/ajax/libs/jquery/1.10.1/jquery.min.js', false, null, true);
    wp_enqueue_script( 'jquery' ); 
}

Şimdi, yukarıdaki kodda, WordPress'in bir parçası olan add_scripts()_ işlevini, sonraki birkaç adımın sırasını özetlemek için nasıl kullandığına dikkat edin. İlk olarak, wp_register_ işlevi belirtilen tüm ayrıntıları alır ve komut dosyasını sayfa altbilgisine yerleştirir ve ardından her şey ayarlandıktan sonra onu çağırmak için wp_enqueue işlevini kullanır.

Toplama

Gerçekten hepsi bu kadar. Eh, bu doğru değil - enqueue, WP'nin oldukça kökleşmiş bir parçasıdır. Ancak bunlar, WordPress ile daha önce sahip olduğunuzdan daha fazlasını yapmanıza neden olan temel bilgilerdir.

Web geliştirmeye başladığımızda komut dosyaları koymayı öğrendiğimiz temel bilgiler hala işe yarıyor, ancak her zaman bir şeyler yapmanın en iyi yolu değiller. WordPress'in PHP üzerine inşa edilmesinin güzelliğinin bir kısmı, bu tür bir mantığı işinize getirirken aynı temel yapıyı ve iş akışını zaten sahip olduğunuz gibi gerçekten koruyabilmenizdir.

hanss / Shutterstock.com'dan makale küçük resmi