Želite li savladati dodavanje jQuery koda na WordPress? Stoga nastavite čitati da biste saznali više.

Unatoč činjenici da je WordPress već neko vrijeme dostupan, a dodavanje skripti za teme i dodacima također postoji već neko vrijeme, još uvijek postoji neka zbrka oko toga koju metodu koristiti. koristite za dodavanje skripti na WordPress.

Pa ćemo pokušati razjasniti stvari.

Budući da je jQuery najrašireniji JavaScript okvir, pokazat ćemo vam kako ga dodati u temu ili WordPress plugin.

Ali prije, ako nikad niste instalirali WordPress, otkrijte Kako instalirati a WordPress blog u 7 koraka et Kako pronaći, instalirati i aktivirati WordPress temu na svoj blog 

Onda se vratimo zašto smo ovdje.

Način kompatibilnosti s JQueryjem

Prije nego što počnemo dodavati skripte na WordPressu, istražimo način kompatibilnosti jQuery. WordPress dolazi s kopijom jQuery-a koju možete koristiti sa svojim kodom. Kad se učita WordPress jQuery, koristi način kompatibilnosti, što je mehanizam za izbjegavanje sukoba s drugim knjižnicama.

Otkrij je li Treba li jQuery ukloniti iz vaših tema i dodataka WordPress ?

To znači da ne možete izravno koristiti znak dolara kao što biste to učinili u drugim projektima. Kada pišete jQuery na WordPressu, umjesto toga morate koristiti jQuery.

Pogledajte donji kôd da vidite što mislim:

/ * Uobičajeni način rada * / $ ('. Hideable'). Uključeno ('klik', funkcija () {$ (this) .hide ();}) / * Način kompatibilnosti * / jQuery ('. Hideable'). Uključeno ('klik', funkcija () {jQuery (this) .hide ();})

Ono što trebate znati je da uz nekoliko izmjena možete ponovno koristiti znak dolara. Upotreba svakog puta "jQuery" na cijelom vašem kodu znatno će zakomplicirati pisanje.

Provjerite 10 kodni urednici za programere programa WordPress

Samo za ponovno osvajanje, ako znate jQuery, znak $ samo je pseudonim za jQuery (), a zatim pseudonim za funkciju. Osnovna sintaksa je: $ (Izbornik) .action () :

• Znak dolara za definiranje jQuery
• A (selektor) za "pronalaženje" HTML elemenata
• JQuery () radnja koja se izvodi na tim elementima

Ako učitate skriptu u podnožje, kôd ćete moći umotati u anonimnu funkciju. Evo kako to učiniti:

(function ($) {$ ('. hideable'). on ('click', function () {$ (this) .hide ();})}) (jQuery);

Ako želite dodati svoju skriptu u zaglavlje (što biste trebali izbjegavati ako je mogućeMožete ga zamotati u funkciju koja se pokreće kada je dokument spreman.

Otkrijte i usput Kako dodati lako kôd na WordPressu bez probijanja vaše web stranice

jQuery (dokument) .ready (function ($) {$ ('. hideable'). on ('click', function () {$ (this) .hide ();})});

Kako povezati svoje skripte na jQuery

Sada kada na WordPress možete napisati važeći jQuery kod, mi ćemo svoj rad povezati s našom web stranicom. U WordPress-u se postupak naziva " enqueueing '(repni sustav). Za normalno HTML web mjesto trebali bismo koristiti oznakurukopis> za dodavanje skripti.

WordPress može učiniti isto, ali koristit ćemo posebne značajke WordPressa da to postignemo. Na taj način WordPress upravlja svim našim ovisnostima za nas.

Ako radite na temi, možete koristiti funkciju wp_enqueue_script () unutar vaše datoteke functions.php datoteka. Evo kako to možete učiniti:

funkcija my_theme_scripts () {wp_enqueue_script ('moja-velika-skripta', get_template_directory_uri (). '/js/my-great-script.js', niz ('jquery'), '1.0.0', true); } add_action ('wp_enqueue_scripts', 'my_theme_scripts');

Funkcija ima pet argumenata. Prvi možete koristiti za referencu na skriptu, drugi je lokacija datoteke skripte, treći parametar je niz ovisnosti.

Dodao sam jQuery kao ovisnost jer ga skripta koristi. Ako izradite skriptu koja ovisi o "moja-pra-skripta Morate ga dodati na popis ovisnosti kako bi WordPress znao koje datoteke treba prvo učitati.

Otkrijte i vi Kako staviti JavaScript na WordPress

Četvrti parametar je broj verzije, a peti parametar WordPressu zna gdje treba staviti skriptu. Prema zadanim postavkama, skripte će se učitati u zaglavlje, što je loša praksa, jer usporava učitavanje stranice vašeg web mjesta (preglednici zaustavljaju učitavanje svih stranica, kad god ih blokiraju est rencontré). Morate umetnuti sve svoje skripte u podnožje, ako je moguće tako što ćete napraviti peti parametar " istinski ".

Kako dodati skriptu na nadzornu ploču

Skripte možete dodati i na kontrolna ploča. Funkcije koje se koriste potpuno su iste, samo trebate upotrijebiti " kuka " različit. Pogledajte primjer u nastavku:

function my_admin_scripts () {wp_enqueue_script ('my-great-script', plugin_dir_url (__FILE__). '/js/my-great-script.js', array ('jquery'), '1.0.0', true); } add_action ('admin_enqueue_scripts', 'my_admin_scripts');

Umjesto korištenja wp_enqueue_scripts moramo koristiti admin_enqueue_scripts, i to je sve !

Korištenje uvjetnih oznaka

Upotrijebite uvjetne oznake tako da svoje skripte učitavate samo po potrebi. To se najčešće koristi na nadzornoj ploči, gdje biste skripte željeli raditi samo na određenoj stranici. Ovo štedi propusnost i vrijeme obrade, što znači brže vrijeme učitavanja vaše web stranice.

Otkrijte i naše 10 WordPress dodaci za poboljšanje brzine učitavanja bloga

Pogledajte dokumentaciju admin_enqueue_scripts u WordPress Codexu za više informacija.

Otkrijte i neke premium WordPress dodatke  

Možete koristiti druge WordPress plugins dati moderan izgled i optimizirati rukovanje vašim blogom ili web stranicom.

Ovdje vam nudimo nekoliko premium WordPress dodataka koji će vam pomoći u tome.

1. Interaktivne svjetske karte

Interaktivne karte svijeta su a WordPress plugin koji vam pomaže stvoriti onoliko karata koliko želite, s interaktivnim i obojenim oznakama, kontinentima, državama ili regijama.

Potpuno je kompatibilan s novom verzijom sustava Windows WordPress i Visual Skladatelj, Zahvaljujući ovom dodatku možete prikazati nekoliko vrsta regija kao što su: karta cijelog svijeta, kontinenta ili potkontinenta (Afrika, Europa, Amerika, Azija, Oceanija i svi njihovi podkontinenti), država, država podijeljena po svojim regijama, država SAD-a, Sjedinjene Države podijeljena na metropolitanska područja, država SAD-a podijeljena na metropolitanska područja.

Preuzmite | demo | Web hosting

2. AJAX kontaktni obrazac s praćenjem

Ce WordPress plugin omogućuje jednostavno dodavanje obrazaca za kontakt ili komentar u vaš WordPress blog. Dolazi s upraviteljem postavki kojem se može izravno pristupiti putem WordPress nadzorne ploče.

Njegova su glavna obilježja između ostalog: a fza e-poštu, podršku CAPTCHA matematika o oblicima, prilagođavanje i konfiguracija preko WordPress nadzorne ploče, mogućnost ddefinirajte prilagođeni automatski odgovor, podršku za prilagođeni CSS i još mnogo toga

Preuzmite | demo | Web hosting 

3. PayPal Standardni Payment Gateway za Ninja Forms

PayPal Standard Gateway za Ninja Forms omogućuje vam izradu obrazaca koji se neprimjetno integriraju s PayPal gatewayom za plaćanje. 

Moći ćete stvoriti personalizirane obrasce za narudžbe i primati uplate pomoću standardnih Paypal računa. Njegove glavne značajke su: jednostavna i brza integracija, IPN integracija, mogućnost aktiviranja / deaktiviranja PayPal pristupnika na pojedinačnim obrascima, podrška za redovna plaćanja itd.

Preuzmite | demo |  Web hosting

Ostali preporučeni resursi

Također vas pozivamo da se savjetujete sa donjim izvorima kako biste poboljšali i kontrolirali svoju web stranicu i blog.

• Kako koristiti kategorije i oznake učinkovito na WordPress
• Kako stvoriti odgovarajući izbornik za mobilne WordPress
• Kako stvoriti WordPress Intranet za vašu organizaciju
• Kako instalirati dodatak u WordPress

Zaključak

Ovdje! To je sve za ovaj vodič. Nadam se da sada znate kako dodati skriptu u WordPress. slobodno se podijelite savjet sa svojim prijateljima na svojim društvenim mrežama.

Međutim, također ćete moći konzultirati naše sredstva, ako vam treba više elemenata za provođenje projekata kreiranja internetskih stranica, savjetujući se s našim vodičem na internetu Izrada bloga WordPress.

Ali, u međuvremenu, recite nam nešto o svom Komentari i prijedloge u posebnom odjeljku.

...