Kiel WordPress ĝuste enkondukas JavaScript?Propra ŝarĝo de JS kaj CSS-dosieroj

porWordPress retejoprogramistoj, evoluantajWordPress kromaĵoAŭ dum agordado de WordPress-temo, iuj JavaScript kaj CSS-skriptrimedoj estas referencitaj.

• Kutime, homoj uzas ligilon, skripto-etikedojn rekte por HTML.
• Fakte, WordPress havas enkonstruitajn kompleksajn funkciojn kaj metodojn por referenci skriptojn.
• Do, uzi enkonstruitajn metodoreferencojn de WordPress estas pli profesia kaj pli etendebla.

La misa citaĵometodo

Estas du komunaj citmetodoj, ĝi estas bone, ĝi simple ne estas perfekta aŭ racia.

Tipo 1:ligilo-etikedoj rilatas al CSS-dosieroj

• Skripto-etikedoj aplikas JS-dosierojn.Ne detale ĉi tie.

Tipo 2:Uzu la funkcion wp_head

• La funkcio wp_head estas uzata por eligi iun propran aŭ sistem-difinitan enhavon.
• Ni foje uzas la sekvan kodon por referenci ĉi tiun dosieron:

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

• Kopiu la supran kodon en la functions.php-dosieron por referenci la respondajn dosierojn.

WordPress Enqueue Scripts rimeda mekanismo

Kiel ni ĉiuj scias, WordPress havas multajn kromaĵojn:

• Preskaŭ ĉiu kromaĵo referencas iun rimedan dosieron.
• Neeviteble, estos konfliktoj inter rimedoj referencitaj de du kromaĵoj, kiuj fariĝos malstabilaj kaj povas influi efikecon.

Uzu la funkcion wp_enqueue_script

• Por referenci rimedon en WordPress vi devus uziwp_enqueue_scriptFunkcio kiu havas la vorton enqueue en la nomo de la envicigita aŭ ordigita funkcio.
• Kun ĉi tiu WordPress-maniero de enqueueing rimedoj (Enqueue Scripts), la referencoj estas apartigitaj de la respondaj dosieroj kaj kerna kodo.
• Se la uzanto volas malŝalti la rimedon, li povas forigi, modifi kaj komenti ĝin sen modifi ĝin de la kerna kodo.

Ankaŭ iuj ofte uzataj bibliotekoj kiel jQuery, jQuery UI, ktp. estas konstruitaj en WordPress.

Ni povas uzi la funkcion wp_enqueue_script por voki la enkonstruitan bibliotekon rekte, kiu konservas kodon kaj pli puran specifon.

Se vi uzas ĉi tiun funkcion por referenci viajn proprajn dosierojn JS kaj CSS, vi devas uziwp_register_scriptLa funkcio registras identigilon (tenilon) kaj poste uzaswp_enqueue_scriptLa funkcio vokas la rimedon respondan al ĉi tiu flago.

Kiel ĝuste importi JS kaj CSS-dosierojn en WordPress?

WordPress provizas prudentajn importmetodojn por JS kaj CSS-metodoj.

Vi povas uzi la jenan kodon por importi la kromprogramon.css-dosieron en la kromprogramon ▼

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

Ĉi-supra uzas la funkcion wp_register_script por krei rimedon kun la identigilo plugin_stylesheet.

Poste, aldonu ĝiajn vicigitajn petojn alwp_enqueue_scriptsagoj funkcias.

Kvankam la funkcionomo estas skripto, ĝi havas nenion komunan kun la speco de rimeddosiero kaj validas kaj por CSS kaj JS.

La funkcio wp_register_script vere ne estas tiel simpla, ĝi povas havi kvin parametrojn:

1) $tenilo:Rimeda identigilo.

• 由wp_enqueue_scripttranslokigo.

2) $src:La loko de la rimedo.

• Relativaj aŭ absolutaj adresoj uzas WordPress-enkonstruitajn funkciojn por akiri adresojn ktp.
• KomunaPoziciigadofunkcio havasplugins_url,get_template_directory_uriAtendu

3) $deps:fidi.

• Se vi aludas al la kromaĵo jQuery kaj bezonas fidi jQuery por konstrui, vi devas plenigi jQuery.
• Notu ke ĝi estas pasita kiel tabelo.

4) $ver:Rimeda versio, laŭvola.

5) $en_piedo:Ĉu vi metas ĝin malsupre?

• Kutime, JS-dosieroj devas esti metitaj ĉe la malsupro de la paĝo, vi povas agordi ĉi tiun parametron al Vera, lasi ĝin malplena aŭ Falsa por eligi supre.

Ni rigardu pli kompletan JavaScript-dosier-referencekzemplon ▼

<?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-temoj uzas wp_enqueue_script por importi rimedojn

Programistoj en WordPress temo disvolviĝo, uzuwp_enqueue_scriptImporti rimedojn.

• La supraj ekzemploj estas ekzemploj de referencitaj rimedoj por WordPress-aldonaĵ-evoluo.
• La metodo referencita en la temo estas simila.

La ĉefa diferenco estas uzi la respondan funkcion por akiri la teman dosierujon por ricevi la rimedan adreson sub la temo.

vi povas uziget_template_directory_urifunkcio por akiri la nunan etosierujon.

Se vi uzas infanan temon, vi devos uziget_stylesheet_directory_uriLa funkcio ricevas la dosierujon de la gepatra temo por akiri la respondajn rimedojn.