Hoe stel WordPress JavaScript behoorlik bekend?Pasgemaakte laai JS- en CSS-lêers

gebruikWordPress webwerfprogrammeerders, ontwikkelWordPress-inpropOf wanneer 'n WordPress-tema aangepas word, word daar na sommige JavaScript- en CSS-skripbronne verwys.

• Gewoonlik gebruik mense skakel, script tags direk vir HTML.
• Trouens, WordPress het ingeboude gesofistikeerde funksies en metodes om skrifte te verwys.
• Dus, die gebruik van WordPress se ingeboude metodeverwysings is meer professioneel en meer uitbreibaar.

Die gebrekkige aanhalingsmetode

Daar is twee algemene aanhalingsmetodes, dit is goed, dit is net nie perfek of redelik nie.

Tipe 1:skakeletikette verwys na CSS-lêers

• Skripmerkers pas JS-lêers toe.Nie hier uiteengesit nie.

Tipe 2:Gebruik die wp_head funksie

• Die wp_head-funksie word gebruik om sekere persoonlike of stelselgedefinieerde inhoud uit te voer.
• Ons gebruik soms die volgende kode om na hierdie lêer te verwys:

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

• Kopieer die bogenoemde kode na die functions.php-lêer om na die ooreenstemmende lêers te verwys.

WordPress Enqueue Scripts hulpbronmeganisme

Soos ons almal weet, het WordPress baie plugins:

• Byna elke inprop verwys na een of ander hulpbronlêer.
• Daar sal onvermydelik konflikte wees tussen hulpbronne waarna twee inproppe verwys, wat onstabiel sal word en doeltreffendheid kan beïnvloed.

Gebruik die wp_enqueue_script-funksie

• Om na 'n hulpbron in WordPress te verwys wat jy moet gebruikwp_enqueue_script'n Funksie wat die woord enqueue het in die naam van die inwaggestelde of gesorteerde funksie.
• Met hierdie WordPress-manier om hulpbronne in toue te plaas (Enqueue Scripts), word die verwysings geskei van die ooreenstemmende lêers en kernkode.
• As die gebruiker die hulpbron wil deaktiveer, kan hy dit uitvee, wysig en kommentaar lewer sonder om dit vanaf die kernkode te wysig.

Ook, sommige algemeen gebruikte biblioteke soos jQuery, jQuery UI, ens. is in WordPress ingebou.

Ons kan die wp_enqueue_script-funksie gebruik om die ingeboude biblioteek direk te bel, wat kode en 'n skoner spesifikasie stoor.

As jy hierdie funksie gebruik om jou eie JS- en CSS-lêers te verwys, moet jy dit gebruikwp_register_scriptDie funksie registreer 'n identifiseerder (handvatsel) en gebruik danwp_enqueue_scriptDie funksie roep die hulpbron wat met hierdie vlag ooreenstem.

Hoe om JS- en CSS-lêers behoorlik in WordPress in te voer?

WordPress bied sinvolle invoermetodes vir JS- en CSS-metodes.

Jy kan die volgende kode gebruik om die plugin.css-lêer in die inprop in te voer ▼

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

Bogenoemde gebruik die wp_register_script-funksie om 'n hulpbron te skep met die identifiseerder plugin_stylesheet.

Voeg dan sy tou-versoeke bywp_enqueue_scriptsaksies in werking is.

Alhoewel die funksienaam 'n script is, het dit niks te doen met die tipe hulpbronlêer nie en is dit geldig vir beide CSS en JS.

Die wp_register_script-funksie is regtig nie so eenvoudig nie, dit kan vyf parameters hê:

1) $handle:Hulpbron identifiseerder.

• 由wp_enqueue_scriptoordrag.

2) $src:Die ligging van die hulpbron.

• Relatiewe of absolute adresse gebruik WordPress ingeboude funksies om adresse te kry, ens.
• AlgemenePosisioneringfunksie hetplugins_url,get_template_directory_uri等.

3) $deps:vertrou.

• As jy na die jQuery-inprop verwys en op die jQuery-bou moet staatmaak, moet jy jQuery invul.
• Let daarop dat dit as 'n skikking deurgegee word.

4) $ver:Hulpbron weergawe, opsioneel.

5) $in_footer:Sit jy dit onderaan?

• Normaalweg moet JS-lêers onderaan die bladsy geplaas word, jy kan hierdie parameter op Waar stel, dit leeg laat of Onwaar om na bo uit te voer.

Kom ons kyk na 'n meer volledige JavaScript-lêerverwysingsvoorbeeld ▼

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

WordPress-temas gebruik wp_enqueue_script om hulpbronne in te voer

Programmeerders in WordPress-tema-ontwikkeling, gebruikwp_enqueue_scriptVoer hulpbronne in.

• Bogenoemde voorbeelde is voorbeelde van verwysde bronne vir WordPress-inpropontwikkeling.
• Die metode waarna in die onderwerp verwys word, is soortgelyk.

Die belangrikste verskil is om die ooreenstemmende funksie te gebruik om die temagids te kry om die hulpbronlêeradres onder die tema te kry.

jy kan gebruikget_template_directory_urifunksie om die huidige temagids te kry.

As jy 'n kindertema gebruik, sal jy dit moet gebruikget_stylesheet_directory_uriDie funksie kry die ouertema se gids om die ooreenstemmende hulpbronne te kry.