Sut mae WordPress yn cyflwyno JavaScript yn iawn?Llwytho ffeiliau JS a CSS yn bersonol

DefnyddiwchGwefan WordPressrhaglenwyr, yn datblyguAtegyn WordPressNeu wrth addasu thema WordPress, cyfeirir at rai adnoddau sgriptio JavaScript a CSS.

• Fel arfer, mae pobl yn defnyddio dolen, tagiau sgript yn uniongyrchol ar gyfer HTML.
• Mewn gwirionedd, mae gan WordPress swyddogaethau a dulliau soffistigedig o gyfeirnodi sgriptiau.
• Felly, mae defnyddio cyfeiriadau dull adeiledig WordPress yn fwy proffesiynol ac yn fwy estynadwy.

Y dull dyfynnu diffygiol

Mae dau ddull dyfynnu cyffredin, mae'n iawn, nid yw'n berffaith nac yn rhesymol.

Math 1:mae tagiau cyswllt yn cyfeirio at ffeiliau CSS

• Mae tagiau sgript yn berthnasol i ffeiliau JS.Heb ei fanylu yma.

Math 2:Defnyddiwch y swyddogaeth wp_head

• Defnyddir y swyddogaeth wp_head i allbynnu rhywfaint o gynnwys wedi'i deilwra neu wedi'i ddiffinio gan system.
• Weithiau byddwn yn defnyddio'r cod canlynol i gyfeirio at y ffeil hon:

<?php
add_action('wp_head', 'wpcwl_normal_script');
function wpcwl_normal_script() {
echo '资源文件的链接';
}
?>

• Copïwch y cod uchod i'r ffeil functions.php i gyfeirio at y ffeiliau cyfatebol.

Mecanwaith adnoddau WordPress Enqueue Scripts

Fel y gwyddom i gyd, mae gan WordPress lawer o ategion:

• Mae bron pob ategyn yn cyfeirio at rai ffeil adnoddau.
• Yn anochel, bydd gwrthdaro rhwng adnoddau y cyfeirir atynt gan ddau ategyn, a fydd yn dod yn ansefydlog ac a allai effeithio ar effeithlonrwydd.

Defnyddiwch y ffwythiant wp_enqueue_script

• I gyfeirio at adnodd yn WordPress dylech ei ddefnyddiowp_enqueue_scriptSwyddogaeth sydd â'r gair ciw yn enw'r ffwythiant enqueued neu sorted.
• Gyda'r ffordd WordPress hon o enciwio adnoddau (Sgriptiau Enqueue), mae'r cyfeiriadau wedi'u gwahanu oddi wrth y ffeiliau cyfatebol a'r cod craidd.
• Os yw'r defnyddiwr am analluogi'r adnodd, gall ei ddileu, ei addasu a rhoi sylwadau arno heb ei addasu o'r cod craidd.

Hefyd, mae rhai llyfrgelloedd a ddefnyddir yn gyffredin fel jQuery, jQuery UI, ac ati wedi'u hymgorffori yn WordPress.

Gallwn ddefnyddio'r swyddogaeth wp_enqueue_script i alw'r llyfrgell adeiledig yn uniongyrchol, sy'n arbed cod a manyleb glanach.

Os ydych chi'n defnyddio'r swyddogaeth hon i gyfeirio at eich ffeiliau JS a CSS eich hun, mae angen i chi ei defnyddiowp_register_scriptMae'r swyddogaeth yn cofrestru dynodwr (handlen) ac yna'n defnyddiowp_enqueue_scriptMae'r swyddogaeth yn galw'r adnodd sy'n cyfateb i'r faner hon.

Sut i fewnforio ffeiliau JS a CSS yn WordPress yn iawn?

Mae WordPress yn darparu dulliau mewnforio synhwyrol ar gyfer dulliau JS a CSS.

Gallwch ddefnyddio'r cod canlynol i fewnforio'r ffeil plugin.css i'r ategyn ▼

<?php
function wpcwl_add_styles() {
wp_register_script('plugin_stylesheet', plugins_url('plugin.css', __FILE__));
wp_enqueue_script('plugin_stylesheet');
}

add_action( 'wp_enqueue_scripts', 'wpcwl_add_styles' ); 
?>

Mae'r uchod yn defnyddio'r ffwythiant wp_register_script i greu adnodd gyda'r dynodwr plugin_stylesheet.

Yna, ychwanegwch ei geisiadau ciwio iwp_enqueue_scriptsgweithredoedd ar waith.

Er mai sgript yw enw'r swyddogaeth, nid oes ganddo unrhyw beth i'w wneud â'r math o ffeil adnoddau ac mae'n ddilys ar gyfer CSS a JS.

Nid yw'r swyddogaeth wp_register_script mor syml â hynny, gall fod â phum paramedr:

1) $ handle:Dynodydd adnoddau.

• 由wp_enqueue_scripttrosglwyddiad.

2) $src:Lleoliad yr adnodd.

• Mae cyfeiriadau cymharol neu absoliwt yn defnyddio swyddogaethau adeiledig WordPress i gael cyfeiriadau, ac ati.
• CyffredinLleoliswyddogaeth wediplugins_url,get_template_directory_uriArhoswch.

3) $deps:dibynnu.

• Os ydych chi'n cyfeirio at yr ategyn jQuery a bod angen i chi ddibynnu ar yr adeiladwaith jQuery, mae angen i chi lenwi jQuery.
• Sylwch ei fod yn cael ei basio fel arae.

4) $ver:Fersiwn adnoddau, dewisol.

5) $in_footer:Ydych chi'n ei roi ar y gwaelod?

• Fel arfer, dylid gosod ffeiliau JS ar waelod y dudalen, gallwch chi osod y paramedr hwn i Gwir, ei adael yn wag neu Anghywir i allbwn i'r brig.

Gadewch i ni edrych ar enghraifft gyfeirio ffeil JavaScript fwy cyflawn ▼

<?php
function wpcwl_add_scripts() {
wp_register_script('plugin_script', plugins_url('plugin_script.js', __FILE__), array('jquery'),'1.1', true);
wp_enqueue_script('plugin_script');
}

add_action( 'wp_enqueue_scripts', 'wpcwl_add_scripts' ); 
?>

Mae themâu WordPress yn defnyddio wp_enqueue_script i fewnforio adnoddau

Rhaglenwyr mewn datblygu thema WordPress, defnyddiowp_enqueue_scriptMewnforio adnoddau.

• Mae'r enghreifftiau uchod yn enghreifftiau o adnoddau y cyfeirir atynt ar gyfer datblygu ategyn WordPress.
• Mae'r dull y cyfeirir ato yn y pwnc yn debyg.

Y prif wahaniaeth yw defnyddio'r swyddogaeth gyfatebol i gael y cyfeiriadur thema i gael cyfeiriad y ffeil adnoddau o dan y thema.

gallwch ddefnyddioget_template_directory_uriswyddogaeth i gael y cyfeiriadur thema cyfredol.

Os ydych chi'n defnyddio thema plentyn, bydd angen i chi ei ddefnyddioget_stylesheet_directory_uriMae'r swyddogaeth yn cael cyfeiriadur thema'r rhiant i gael yr adnoddau cyfatebol.