I-WordPress yazisa njani ngokufanelekileyo iJavaScript?Custom ukulayisha iifayile JS kunye CSS

zeIwebhusayithi yeWordPressabadwelisi benkqubo, abaphuhlisayoIplagi ye-WordPressOkanye xa ulungelelanisa umxholo we-WordPress, ezinye izixhobo ze-JavaScript kunye ne-CSS zokubhala zibhekiswa.

I-WordPress HTML yazisa ukulayisha iJavaScript (JS) kunye neefayile zeCSS

  • Ngesiqhelo, abantu basebenzisa ikhonkco, iithegi zeskripthi ngokuthe ngqo kwi-HTML.
  • Enyanisweni, i-WordPress inemisebenzi eyakhelwe-ngaphakathi eyinkimbinkimbi kunye neendlela zokubhekisela kwizikripthi.
  • Ke, ukusebenzisa i-WordPress 'izalathiso zendlela eyakhelwe-ngaphakathi kubuchwephesha ngakumbi kwaye kwanda ngakumbi.

Indlela yokucaphula engalunganga

Zimbini iindlela zokucaphula eziqhelekileyo, kulungile, akugqibelelanga okanye kusengqiqweni.

Uhlobo 1:iithegi zekhonkco zibhekisa kwiifayile zeCSS

  • Iithegi zeskripthi zisebenzisa iifayile zeJS.Ayichazwanga apha.

Uhlobo 2:Sebenzisa umsebenzi we-wp_head

  • Umsebenzi we-wp_head usetyenziselwa ukukhupha isiko elithile okanye umxholo ochaziweyo wenkqubo.
  • Ngamanye amaxesha sisebenzisa le khowudi ilandelayo ukubhekisa le fayile:
<?php
add_action('wp_head', 'wpcwl_normal_script');
function wpcwl_normal_script() {
echo '资源文件的链接';
}
?>
  • Khuphela ikhowudi engentla kwifayile yemisebenzi.php ukubhekisela kwiifayile ezihambelanayo.

Indlela yomthombo we-WordPress Enqueue Scripts

Njengoko sonke siyazi, i-WordPress ineeplagi ezininzi:

  • Phantse zonke ii-plugin ezibhekiselele kwifayile ethile yomthombo.
  • Ngokungathandabuzekiyo, kuya kubakho ukungqubana phakathi kwezixhobo ezibhekiselele kwiiplagi ezimbini, eziya kuzinza kwaye zinokuchaphazela ukusebenza kakuhle.

Sebenzisa i-wp_enqueue_script umsebenzi

  • Ukubhekisela kwisixhobo kwi-WordPress kufuneka usebenzisewp_enqueue_scriptUmsebenzi onegama elithi equeue egameni lomgca okanye umsebenzi ohleliweyo.
  • Nge-WordPress 'indlela ye-enqueueing resources (Izikripthi ze-Enqueue), iireferensi zihlukaniswe kwiifayile ezihambelanayo kunye nekhowudi engundoqo.
  • Ukuba umsebenzisi ufuna ukukhubaza uvimba, unokucima, ukuguqula kunye nokuphawula ngaphandle kokuguqula ikhowudi engundoqo.

Kwakhona, amanye amathala eencwadi asetyenziswa ngokuqhelekileyo njengejQuery, i-jQuery UI, njl., akhiwe kwi-WordPress.

Singasebenzisa umsebenzi we-wp_enqueue_script ukubiza ilayibrari eyakhelwe-ngaphakathi ngokuthe ngqo, egcina ikhowudi kunye nenkcazo ecocekileyo.

Uluhlu lwengcaciso eyakhelwe-ngaphakathi amathala eencwadi kunye nezazisi (iziphatho) zinikiwe apha

Ukuba usebenzisa lo msebenzi ukureferensia eyakho iifayile zeJS kunye neCSS, kufuneka usebenzisewp_register_scriptUmsebenzi ubhalisa isazisi (isibambo) emva koko sisebenzisewp_enqueue_scriptUmsebenzi ubiza uvimba ohambelana nale flegi.

Indlela yokungenisa ngokufanelekileyo iifayile ze-JS kunye ne-CSS kwi-WordPress?

I-WordPress ibonelela ngeendlela zokungenisa ezinengqiqo kwiindlela ze-JS kunye ne-CSS.

Ungasebenzisa le khowudi ilandelayo ukungenisa ifayile ye-plugin.css kwi-plugin ▼

<?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' ); 
?>

Okungasentla kusebenzisa umsebenzi we-wp_register_script ukwenza uvimba kunye ne-identifier plugin_stylesheet.

Emva koko, yongeza izicelo zayo ezikuluhluwp_enqueue_scriptsiintshukumo ziyasebenza.

Nangona igama lomsebenzi lisiscript, alinanto yakwenza nodidi lwefayile yovimba kwaye liyasebenza kuzo zombini iCSS kunye neJS.

Umsebenzi we-wp_register_script awukho lula kangako, unokuba neeparamitha ezintlanu:

1) $umqheba:Isichongi sobutyebi.

  • wp_enqueue_scriptugqithiselo.

2) $src:Indawo yomthombo.

  • Iidilesi ezihambelanayo okanye ezipheleleyo zisebenzisa imisebenzi eyakhelwe-ngaphakathi ye-WordPress ukufumana iidilesi, njl.
  • NgokuqhelekileyoUkubekwa endaweniumsebenzi uneplugins_url,get_template_directory_uriYima.

3) $deps:thembela.

  • Ukuba ubhekisa kwi-plugin ye-jQuery kwaye kufuneka uthembele kwi-jQuery ukwakha, kufuneka ugcwalise i-jQuery.
  • Qaphela ukuba igqithiswa njengoluhlu.

4) $ver:Uguqulelo lwemithombo, ukhetho.

5) $in_footer:Ngaba uyibeka ezantsi?

  • Ngokuqhelekileyo, iifayile ze-JS kufuneka zibekwe ezantsi kwephepha, ungacwangcisa le parameter ukuya kwiNyaniso, yiyeke ingenanto okanye Bubuxoki ukukhupha phezulu.

Makhe sijonge umzekelo opheleleyo wefayile yeJavaScript ▼

<?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' ); 
?>

Imixholo ye-WordPress isebenzisa i-wp_enqueue_script ukungenisa izixhobo

Abadwelisi beprogram kuphuhliso lomxholo we-WordPress, sebenzisawp_enqueue_scriptThatha ngaphandle izixhobo.

  • Le mizekelo ingentla yimizekelo yezibonelelo ezikhankanyiweyo zophuhliso lwe-WordPress plugin.
  • Indlela ekubhekiselwe kuyo kwisihloko iyafana.

Umahluko ophambili kukusebenzisa umsebenzi ohambelanayo ukufumana ulawulo lomxholo ukufumana idilesi yefayile yovimba phantsi komxholo.

ungasebenzisaget_template_directory_uriumsebenzi ukufumana ulawulo lwangoku lomxholo.

Ukuba usebenzisa umxholo womntwana, kuya kufuneka usebenziseget_stylesheet_directory_uriUmsebenzi ufumana ulawulo lomxholo womzali ukufumana izixhobo ezihambelanayo.

Shiya uluvo

Idilesi yakho ye-imeyile ayizupapashwa. Iinkalo ezifunekayo zisetyenzisiwe * Ileyibheli

Skrolela phezulu