Anonim

Kako tvrdi vodeća CMS zajednica, 25% interneta koristi WordPress. Gledajući trendove, nemamo druge opcije osim da im vjerujemo, čini se da gotovo svaki drugi blog i svaka četvrta web lokacija koriste prividno najsnažniji i korisnički CMS. Radujući se tome, ljudi i programeri započeli su premještati svoje web stranice na WordPress platformu.

U ovom nastojanju da svoju slatku i jednostavnu web stranicu transformišem u složenu, visoko učinkovitu CMS stranicu, ljudi se zaglave na vrlo osnovnom koraku i postavljaju pitanje: Za ljubav, kako mogu dobiti ovu vanjsku JavaScript (.js) datoteku radi u ovoj WordPress temi? Jeste li i vi taj koji postavljate isto pitanje? Pa amigosi, konačno ste na pravom mjestu: tu sam da vas vodim korak po korak kroz najjednostavniji mogući način za postizanje ovog zadatka!

Sad pod pretpostavkom da imate instaliran WordPress i pokrenite vanjski JS, pripremimo se za uključenje datoteke!

Napomena: Za ovaj udžbenik koristim sljedeću datoteku (testrun.js), a tema na kojoj radim je WordPress's Twenty Sixteen.

alert ( 'Hello');

Započnimo!

Sve skripte i tablice stilova učitavaju se unutar function.php . Ovo je ispravan način za njihovo učitavanje u WordPressu kako ne bi došlo do sukoba s bilo kojom drugom skriptu koja se učitava ili od samog WordPress-a ili od upotrebe dodataka. Ako dozvolite WordPressu da upravlja svim uključenim datotekama, tada trebate dati do znanja da želite da ta datoteka bude uključena u zaglavni (početni) ili podnožni (krajnji) dio datoteke. Svaki predložak / tema ima svoje funkcije.php, pa bi bilo teško generirati točan naziv funkcija koji uključuje sve datoteke koje treba uključiti. Budući da kao temu uzimam dvadeset šesnaest, u nastavku je prikaz načina rada mojih funkcija.php (koristi se za uključivanje datoteka). Vaši bi trebali u određenoj mjeri nalikovati na ovo:

Funkcija wp_enqueue_script povezuje datoteku skripte na generiranu stranicu u pravo vrijeme prema ovisnostima o skriptu, ako skripta nije već uključena i ako su sve ovisnosti registrirane. Možete povezati skriptu s ručkom prethodno registriranom pomoću funkcije wp_register_script () ili pružiti ovoj funkciji sve parametre potrebne za povezivanje skripte.

Wp_enqueue_script ($ handle, $ src, $ deps, $ ver, $ in_footer) sadrži sljedeće parame:

$ ručka

(string) (Obavezno) Naziv skripte.

$ src

(string | bool) (neobavezno) Put do skripte iz korijenskog direktorija WordPressa. Primjer: '/js/myscript.js'.

Zadana vrijednost: false

$ deps

(niz) (neobavezno) O matici registriranih ručki ove skripte ovisi.

Zadana vrijednost: array ()

$ ver

(string | bool) (neobavezno) Niz koji navodi broj verzije skripte, ako ga ima. Ovaj se parametar koristi da bi se osiguralo da se ispravna verzija šalje klijentu bez obzira na predmemoriranje, i tako treba biti uključena ako je dostupan broj verzije i ima smisla za skriptu.

Zadana vrijednost: false

$ in_footer

(bool) (neobavezno) Želite li prethodno pokrenuti skriptu ili prije , Zadani 'false'. Prihvaća 'lažno' ili 'istinito'.

Zadana vrijednost: false

Možete zanemariti funkciju wp_register_script () za ovaj vodič. Naša je svrha uključiti samo vanjski JS. Trebalo bi funkcionirati sasvim dobro i bez njega!

Stoga, ako želim svoju skriptu imenovati „testom“, zapamtite da ovaj param ($ handle) NIJE nužno ime stvarne datoteke, a moja datoteka ima vanjsku ovisnost o jqueryju, a verzija je 1.0 i učitava se prije učitavanja stranice. onda bi moja funkcija izgledala kao:

wp_enqueue_script ('tutorial', get_template_directory_uri (). '/js/testrun.js', array ('jquery'), '1.0', false);

Ako primijetite, koristio sam get_template_directory_uri (), tako da je niz koji je povezan nakon funkcije, tj. " /Js/testrun.js ", zapravo put datoteke do datoteke indeksa predloška .

Dakle, vaš atribut $ src, koji je izvor vaše js datoteke, postaje: get_template_directory_uri (). 'Path_to_js_wrt_index_of_template'.

Stoga konačna function.php izgleda kao:

Držite se tamo, skoro smo uspjeli! Samo sada spremite ovo i pritisnite osvježiti na svojoj web stranici … trebali biste vidjeti kako JS radi! Evo moje:

Kako smo opciju $ in_footer postavili na false, skripta se učitava prije učitavanja stranice, ali nakon što se učita JQuery jer je dodana kao ovisnost!

I .. Voila! Evo je. Uspješno ste uključili vanjsku prilagođenu JS datoteku u svoju WP temu!

Sretno kodiranje !!

Referenca: Enqueue funkcija: WordPress Codex

Koji je najbolji način dodavanja prilagođenih vanjskih js-a u wordpress