Om du \u00e4r en WordPress-utvecklare h\u00f6rde du om orden som wp_enqueue_script, wp_enqueue_style och wp_enqueue_scripts. Det h\u00e4r \u00e4r de metoder vi b\u00f6r anv\u00e4nda f\u00f6r att inkludera JavaScript och CSS i WordPress.<\/p>\n
N\u00e4r det g\u00e4ller WordPress ska man inte anv\u00e4nda skript- och l\u00e4nktaggar f\u00f6r att l\u00e4gga till JavaScript- och CSS-filer.<\/p>\n
F\u00f6r en webbplats \u00e4r det vanligt att anv\u00e4nda olika typer av effekter, animationer f\u00f6r att f\u00f6rb\u00e4ttra anv\u00e4ndarupplevelsen. Det finns gott om f\u00e4rdiga plugins tillg\u00e4ngliga p\u00e5 internet som g\u00f6r att vi kan l\u00e4gga till skjutreglage, kontaktformul\u00e4r, karusell etc p\u00e5 din webbplats. N\u00e4r vi anv\u00e4nder dessa externa resurser m\u00e5ste vi anv\u00e4nda JS- och CSS-filer som tillhandah\u00e5lls av dem. Genom att anv\u00e4nda de WordPress-tillhandah\u00e5llna metoderna kan vi styra sidor d\u00e4r s\u00e5dana plugins endast kan anv\u00e4ndas. Till exempel, om vi visar skjutreglaget p\u00e5 startsidan, finns det inget behov av att inkludera skjutreglaget JS och CSS-filer p\u00e5 en annan sida. Det \u00e4r alltid en bra praxis att endast inkludera JS och CSS n\u00e4r det beh\u00f6vs. Detta \u00e4r en bra praxis som anv\u00e4nds f\u00f6r att f\u00f6rb\u00e4ttra webbplatsens prestanda och g\u00f6ra att v\u00e5r webbplats laddas snabbare.<\/p>\n
L\u00e5t oss anta att vi har custom.js och custom.css-filer som m\u00e5ste l\u00e4ggas till p\u00e5 v\u00e5r webbplats. F\u00f6r detta m\u00e5ste vi placera under koden.<\/p>\n
add_action('wp_enqueue_scripts', 'include_js_css');\nfunction include_js_css() {\n\u00a0\u00a0\u00a0\u00a0wp_register_script('my-custom-script', get_stylesheet_directory_uri(). '\/js\/custom.js', array('jquery'), false, true);\n\u00a0\u00a0\u00a0\u00a0wp_enqueue_script('my-custom-script');\n\u00a0\n\u00a0\u00a0\u00a0\u00a0wp_register_style( \"my-custom-style\", get_stylesheet_directory_uri(). \"\/css\/custom.css\", array(), false, \"all\" );\n\u00a0\u00a0\u00a0\u00a0wp_enqueue_style( \"my-custom-style\" );\n}<\/code><\/pre>\nObs!<\/strong> Den tredje parametern i funktionen wp_register_script. Vi passerade array (’jquery’) vilket inneb\u00e4r att v\u00e5r custom.js \u00e4r beroende av jquery.js-filen. Du kan skapa en emapy-array h\u00e4r om ditt skript inte har beroende.<\/p>\nDen sista parametern \u00e4r satt till true vilket inneb\u00e4r att du inkluderar custom.js-filen i en sidfot (f\u00f6re slutet av body-taggen).<\/p>\n
Parameterf\u00f6rklaring f\u00f6r funktionen wp_register_script ()<\/h3>\n
$ handle<\/strong> (Obligatoriskt): Namnet p\u00e5 skriptet. B\u00f6r vara unik.
\n$ src<\/strong> (Obligatoriskt): Skriptets fullst\u00e4ndiga URL eller skriptets s\u00f6kv\u00e4g i f\u00f6rh\u00e5llande till WordPress-rotkatalogen.
\n$ deps<\/strong> (valfritt): En upps\u00e4ttning registrerade skript hanterar detta skript beror p\u00e5.
\nStandardv\u00e4rde: array ()
\n$ ver<\/strong> (valfritt): Str\u00e4ng som anger skriptets versionsnummer, om det har ett, som l\u00e4ggs till URL: en som en fr\u00e5gestr\u00e4ng f\u00f6r cache-busting-syften. Om versionen \u00e4r inst\u00e4lld p\u00e5 falsk l\u00e4ggs automatiskt till ett versionsnummer som motsvarar den nuvarande installerade WordPress-versionen. Om den \u00e4r satt till null l\u00e4ggs ingen version till. Standardv\u00e4rdet \u00e4r falskt
\n$ in_footer<\/strong> (Valfritt): Huruvida manuset ska l\u00e4ggas till innan st\u00e4ngningen av body-taggen ist\u00e4llet f\u00f6r i huvudet. Standard ’falskt’.<\/p>\nParameterf\u00f6rklaring f\u00f6r funktionen wp_register_style ()<\/h3>\n
$ handtag<\/strong> (obligatoriskt): Namn p\u00e5 formatmallen. B\u00f6r vara unik.
\n$ src<\/strong> (Obligatoriskt): Hela webbadressen f\u00f6r formatmallen eller s\u00f6kv\u00e4gen till formatmallen i f\u00f6rh\u00e5llande till WordPress-rotkatalogen.
\n$ deps<\/strong> (valfritt): En upps\u00e4ttning registrerade formatmallar hanterar detta formatmall beror p\u00e5.
\nStandardv\u00e4rde: array ()
\n$ ver<\/strong> (valfritt): Str\u00e4ng som anger formatmallens versionsnummer, om det har ett, som l\u00e4ggs till URL: en som en fr\u00e5gestr\u00e4ng f\u00f6r cache-busting-syften. Om versionen \u00e4r inst\u00e4lld p\u00e5 falsk l\u00e4ggs automatiskt till ett versionsnummer som motsvarar den nuvarande installerade WordPress-versionen. Om den \u00e4r satt till null l\u00e4ggs ingen version till. Standardv\u00e4rde: false
\n$ media<\/strong>(Valfritt): Mediet som detta formatmall har definierats f\u00f6r. Accepterar mediatyper som ’alla’, ’skriv ut’ och ’sk\u00e4rm’ eller mediefr\u00e5gor som ’(orientering: st\u00e5ende)’ och ’(max-bredd: 640 pixlar)’. Standardv\u00e4rde: ’alla’.<\/p>\nDet handlar om hur man inkluderar JavaScript och CSS i WordPress. Om du har n\u00e5gra fr\u00e5gor eller f\u00f6rslag, v\u00e4nligen l\u00e4mna kommentarer nedan.<\/p>\n