Özel harici j'leri wordpress'e eklemenin en iyi yolu nedir

Önde gelen CMS topluluğu tarafından iddia edildiği gibi, internetin% 25'i WordPress kullanıyor. Trendleri görünce, onlara inanmaktan başka seçeneğimiz yok, neredeyse her ^2'nci blog ve her 4 sitenin görünüşe göre en güçlü ve kullanıcı dostu CMS kullandığı görülüyor. Bunu dört gözle bekliyorum, insanlar ve geliştiriciler sitelerini WordPress Platformuna kaydırmaya başladı.

Tatlı ve basit web sitenizi karmaşık, yüksek performanslı bir CMS sitesine dönüştürmek için bu çabayla insanlar çok basit bir adım atıp soru soruyor: Aşk için, bu harici JavaScript (.js) dosyasını nasıl edinebilirim bu WordPress temasında çalışıyor musunuz? Siz de aynı soruyu soran siz misiniz? Pekala amigos, nihayet doğru yerdesiniz: Bu görevi başarmanız için en basit yoldan adım adım size rehberlik etmek için buradayım!

Şimdi tüm WordPress'lerin kurulu olduğunu ve dış JS hazır olduğundan emin olduğunuzu varsayalım, dosyayı dahil etme görevine girelim!

Not: Bu eğitim için aşağıdaki dosyayı (testrun.js) kullanıyorum ve üzerinde çalıştığım tema WordPress'in Yirmi On Altı'sı .

alert ( 'Merhaba');

Hadi başlayalım!

Tüm komut dosyaları ve stil sayfaları functions.php içinden yüklenir. Bu, WordPress'e yüklenmek için doğru bir yoldur; böylece, WordPress'in kendisi veya kullanılan eklentileriniz tarafından yüklenen diğer komut dosyalarıyla çakışmamak için. WordPress'in dahil edilen tüm dosyaları yönetmesine izin verirseniz, bu dosyanın dosyanın üstbilgi (başlangıç) veya altbilgi (son) bölümüne dahil edilmesini istediğinizi bilmeniz gerekir. Her şablonun / temanın kendi işlevleri vardır. Bu nedenle, dahil edilecek tüm dosyaları içeren işlevlerin tam adını genelleştirmek zor olacaktır. Bir tema olarak yirmi on altı aldığımdan, aşağıda, dosyalarım için kullanılan fonksiyonlarım.pp'nin nasıl bir anlık olduğu görülmektedir. Sizinki bir dereceye kadar buna benzemelidir:

Wp_enqueue_script işlevi, komut dosyası önceden eklenmemişse ve tüm bağımlılıklar kaydedilmişse, komut dosyası bağımlılıklarına göre doğru zamanda bir komut dosyası dosyasını oluşturulan sayfaya bağlar. Bir betiği daha önce wp_register_script () işlevini kullanarak kaydedilen bir tanıtıcıya bağlayabilir veya bu işlevi bir komut dosyasını bağlamak için gerekli tüm parametreleri sağlayabilirsiniz.

Wp_enqueue_script ($ handle, $ src, $ deps, $ ver, $ in_footer) aşağıdaki paragrafları alır:

$ kolu

(string) (Zorunlu) Komut dosyasının adı.

$ src

(string | bool) (İsteğe bağlı) WordPress'in kök dizininden komut dosyasının yolu. Örnek: '/js/myscript.js'.

Varsayılan değer: false

$ deps

(dizi) (İsteğe bağlı) Bu komut dosyasının dayandığı bir kayıtlı tanıtıcı dizisi.

Varsayılan değer: array ()

$ ver

(string | bool) (İsteğe bağlı) Eğer varsa, komut dosyası sürüm numarasını belirten dize. Bu parametre, önbelleğe bakılmaksızın istemciye doğru sürümün gönderilmesini sağlamak için kullanılır ve bu nedenle sürüm numarası varsa ve komut dosyası için mantıklıysa dahil edilmelidir.

Varsayılan değer: false

$ in_footer

(bool) (İsteğe bağlı) Önce betiğin sıkıştırılıp çalıştırılmayacağı ya da önce . Varsayılan 'yanlış'. 'Yanlış' veya 'doğru' kabul eder.

Varsayılan değer: false

Bu öğretici için wp_register_script () işlevini yok sayabilirsiniz. Amacımız yalnızca harici bir JS eklemektir. Onsuz iyi çalışması gerekir!

Bu nedenle, betiğimi “test” olarak adlandırmak istersem, bu paramın ($ handle) mutlaka gerçek dosyanın adı OLMADIĞINI unutmam, dosyamın jquery ve sürüm üzerinde dış bağımlılığı olması 1.0 ve sayfa yüklenmeden önce yüklenir o zaman benim fonksiyonum şöyle görünür:

wp_enqueue_script ('öğretici', get_template_directory_uri (). '/js/testrun.js', dizi ('jquery'), '1.0', yanlış);

Dikkat ederseniz, get_template_directory_uri () kullandım , bu nedenle, işlevden sonra birleştirilmiş dize, yani “ /js/testrun.js ”, aslında şablonun dizin dosyasındaki wrt dosyasının yoludur.

Böylece, js dosyanızın kaynağı olan $ src niteliğiniz şöyle olur: get_template_directory_uri (). 'Path_to_js_wrt_index_of_template'.

Bu nedenle, final functions.php şöyle görünür:

Tutun orada, neredeyse bitti! Bunu şimdi kaydedin ve web sitenizde tazeleme tuşuna basın… JS'nin çalıştığını görmelisiniz! İşte benim:

$ İn_footer seçeneğini false olarak ayarladığımızdan, script sayfa yüklenmeden önce yüklenir, fakat JQuery bağımlılık olarak eklendiği için yüklendikten sonra!

Ve .. Voila! İşte başlıyorsunuz .. WP temanıza başarıyla harici bir JS dosyası eklediniz!

Mutlu Kodlama !!

Referans: Enqueue İşlevi: WordPress Kodeksi