De wp_enqueue_script
funktionen är den bästa lösningen för att ladda JavaScript-filer till din WordPress-webbplats. Om du utvecklar ett tema som använder JavaScript eller JavaScript-bibliotek, kan wp_enqueue_script
funktion är vägen att gå. Om du inte har använt det här förut för det kan det vara förvirring ... så idag tar vi en djupgående titt på hur du korrekt laddar skript i ditt tema eller plugin med hjälp av enqueue-funktionen.
Vissa aspekter av tillämpningar eller tekniker som används i denna handledning har ändrats sedan den ursprungligen publicerades. Detta kan göra det lite svårt att följa med. Vi rekommenderar att du tittar på de senaste tutorialsna om samma ämne:
Om du kommer från en grundläggande HTML-bakgrund har du förmodligen vanligtvis laddat upp Javascript-filer (inklusive allt från jQuery till plugin-skript) direkt i dokumentets sidhuvud eller sidfot. Det är bra när du befinner dig i en fristående miljö som en grundläggande HTML-sida ... men när du presenterar mängden andra skript som eventuellt kan köras på en WordPress-installation blir det svårare att göra vad jag kallar "crowd management" med din skript.
Så varför ladda inte JavaScript i rubriken eller sidfoten? Svaret är ganska enkelt: Genom att inkludera din JavaScript så riskerar du att ha konflikter med din JavaScript över din installation (tänk, flera plugins försöker ladda samma skript eller olika versioner av det scriptet). Dessutom kommer din JavaScript att ladda på varje sida, även om du inte behöver det. Detta kommer att leda till onödigt längre laddningstid för dina sidor och kan störa andra JavaScript, som från ett plugin eller i instrumentbrädan ... och det är en No No in WP-utveckling.
Genom att använda wp_enqueue_script
fungera. Du har bättre kontroll med hur och när du laddar JavaScript. Du kan även bestämma om du vill ladda in rubriken eller sidfoten.
De wp_enqueue_script
funktionen är vad laddar skript i din WordPress webbplats. Du brukar använda den i din functions.php
fil.
De wp_enqueue_script
funktionen är ganska rakt framåt, så låt oss ta en titt på strukturen.
wp_enqueue_script ($ handtag, $ src, $ deps, $ ver, $ in_footer);
$ handtag
content_url
, bloginfo ( "template_url")
, eller get_template_directory_uri ()
(rekommenderas av WordPress-funktionsreferensen) för teman och plugins_url
för plugins. $ deps
$ ver
$ in_footer
Som du kan se, alla parametrar utom $ handtag
är valfria. Vid första anblicken kan det tyckas konstigt. Särskilt $ scr
parameter. Hur kan WordPress hitta skriptet utan en webbadress?
Anledningen till detta är att WordPress levereras med skript som är inbyggda. Till exempel är jQuery en del av WordPress-kärnan, och WordPress-utvecklingslaget gjorde det super enkelt att ladda dessa inbyggda skript. Allt du behöver göra är att skicka skriptets handtag till wp_enqueue_script
.
För den fullständiga listan med inbyggda WordPress-skript och deras handtag. Ta en titt på WordPress-funktionsreferensen.
Nu när du förstår delarna av wp_enqueue_script
. Låt oss titta på hur du faktiskt använder det här med ditt WordPress-tema.
Det finns andra WordPress-funktioner som du behöver veta innan du kan börja skriva in skript korrekt.
wp_register_script
wp_register_script
funktionen används för att registrera ditt skript med WordPress. Vad detta betyder är att du kommer att kunna använda wp_enqueue_script
för dina skript precis som de inbyggda skript som följer med WordPresswp_register_script
är exakt samma som wp_enqueue_script
struktur, så jag kommer inte att gå över den igen. Du kan hänvisa till ovanstående avsnitt om det behövs.wp_register_script
precis som du skulle för wp_enqueue_script
. Skruva sedan in skriptet med wp_enqueue_script
genom att passera handtaget till det. wp_deregister_script
wp_deregister_script
tar bort ett registrerat skript.wp_deregister_script
wp_dequeue_script
tar bort ett registrerat skript.Det enklaste sättet att ladda ditt skript är att placera wp_enqueue_script
var du än vill ha den på din sida.
Lätt nog, bara inte elegant. Ett bättre sätt är att använda din function.php-fil för att ladda dina skript. För att göra detta behöver du göra en anpassad funktion. Använd sedan add_action
för att initiera din funktion.
load_my_scripts
mitt-skript
mitt-skript
load_my_scripts
Skriptet vi laddade just behöver den nuvarande versionen jQuery körs, så låt oss avregistrera standardversionen som följer med WordPress lägg till den nya versionen till vår funktion.
mitt-skript
OK, bra metoder för WordPress-kodning dikterar att vi måste kontrollera om en funktion finns innan vi kör den. Detta uppnås så här.
Detta kontrollerar om din funktion redan finns. Om det inte gör det, körs din funktion.
Låt oss lägga till detta i vårt load_my_scripts
fungera
Nu, om du går till din administratörssida vill du inte att ditt skript ska laddas. Det kan orsaka konflikter och bryta administratörssidan. En allmän tumregel är att du inte vill att dina anpassade skript ska laddas på admin sidan. Skript för plugins är en annan historia. Jag går över det senare.
Vi ska kolla om sidladdningen är inte administratörssidan med! is_admin (). Om det inte är så laddas våra skript.
Nu ser funktionen ut så här.
Varsågod. En bra mall för dig att använda för att skicka skript
OK, nu när du fick det ner. Låt oss lägga till ett skript som bara laddas på din plugins administratörssida.
Det är faktiskt väldigt enkelt. Skriv bara ditt skriptfunktion precis som det vi gjorde i det föregående avsnittet i pluginfilen. Bara nu istället för att använda 'init' i add_action, använd 'admin_init'.
Det är det, nu kommer ditt skript bara att laddas när du går till pluginets administratörssida.
Jag hoppas att detta kommer att hjälpa dig att förstå bättre Enqueue Scripts inom WordPress, så nu kan du komma dit och ladda några egna skript!
Om det finns något du inte förstår eller vill läsa om. Jag rekommenderar att du besöker WordPress Codex. Här är en lista med några andra relevanta codex länkar för dig också: