Cum introduce WordPress corect JavaScript?Încărcare personalizată a fișierelor JS și CSS

用Site WordPressprogramatori, dezvoltarePlugin WordPressSau atunci când personalizați o temă WordPress, se face referire la unele resurse de scripting JavaScript și CSS.

• De obicei, oamenii folosesc link-uri, etichete de script direct pentru HTML.
• De fapt, WordPress are încorporate funcții și metode sofisticate pentru referirea la scripturi.
• Deci, utilizarea referințelor de metodă încorporate din WordPress este mai profesionistă și mai extensibilă.

Metoda de citare greșită

Există două metode comune de citare, este bine, pur și simplu nu este perfect sau rezonabil.

Tipul 1:etichetele de link se referă la fișierele CSS

• Etichetele de script aplică fișiere JS.Nu este detaliat aici.

Tipul 2:Utilizați funcția wp_head

• Funcția wp_head este folosită pentru a scoate conținut personalizat sau definit de sistem.
• Uneori folosim următorul cod pentru a face referire la acest fișier:

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

• Copiați codul de mai sus în fișierul functions.php pentru a face referire la fișierele corespunzătoare.

Mecanismul de resurse WordPress Queue Scripts

După cum știm cu toții, WordPress are o mulțime de plugin-uri:

• Aproape fiecare plugin face referire la un fișier de resurse.
• Inevitabil, vor exista conflicte între resursele la care se referă două plugin-uri, care vor deveni instabile și pot afecta eficiența.

Utilizați funcția wp_enqueue_script

• Pentru a face referire la o resursă în WordPress ar trebui să utilizațiwp_enqueue_scriptO funcție care are cuvântul coadă în numele funcției puse în coadă sau sortate.
• Cu acest mod WordPress de a pune în coadă resursele (Scripturi de adăpost), referințele sunt separate de fișierele și codul de bază corespunzătoare.
• Dacă utilizatorul dorește să dezactiveze resursa, o poate șterge, modifica și comenta fără a o modifica din codul de bază.

De asemenea, unele biblioteci utilizate în mod obișnuit, cum ar fi jQuery, jQuery UI etc., sunt încorporate în WordPress.

Putem folosi funcția wp_enqueue_script pentru a apela direct biblioteca încorporată, care salvează codul și o specificație mai clară.

Dacă utilizați această funcție pentru a face referire la propriile fișiere JS și CSS, trebuie să o utilizațiwp_register_scriptFuncția înregistrează un identificator (mâner) și apoi foloseștewp_enqueue_scriptFuncția apelează resursa corespunzătoare acestui flag.

Cum să importați corect fișierele JS și CSS în WordPress?

WordPress oferă metode de import sensibile pentru metodele JS și CSS.

Puteți utiliza următorul cod pentru a importa fișierul plugin.css în 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' ); 
?>

Cele de mai sus utilizează funcția wp_register_script pentru a crea o resursă cu identificatorul plugin_stylesheet.

Apoi, adăugați cererile din coadă lawp_enqueue_scriptsacțiunile sunt în funcțiune.

Deși numele funcției este un script, nu are nimic de-a face cu tipul de fișier de resurse și este valabil atât pentru CSS, cât și pentru JS.

Funcția wp_register_script nu este chiar atât de simplă, poate avea cinci parametri:

1) $handle:Identificator de resurse.

• 由wp_enqueue_scripttransfer.

2) $src:Locația resursei.

• Adresele relative sau absolute folosesc funcțiile încorporate WordPress pentru a obține adrese etc.
• Uzualpoziţiefunctia areplugins_url,get_template_directory_uri等.

3) $deps:se bazează.

• Dacă vă referiți la pluginul jQuery și trebuie să vă bazați pe versiunea jQuery, trebuie să completați jQuery.
• Rețineți că este transmis ca o matrice.

4) $ver:Versiunea resursei, opțională.

5) $in_footer:Il pui in jos?

• În mod normal, fișierele JS ar trebui să fie plasate în partea de jos a paginii, puteți seta acest parametru la True, lăsați-l necompletat sau False pentru a ieși în partea de sus.

Să ne uităm la un exemplu de referință de fișier JavaScript mai complet ▼

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

Temele WordPress folosesc wp_enqueue_script pentru a importa resurse

Programatori în dezvoltarea temei WordPress, utilizarewp_enqueue_scriptImportă resurse.

• Exemplele de mai sus sunt exemple de resurse la care se face referire pentru dezvoltarea pluginului WordPress.
• Metoda la care face referire în subiect este similară.

Principala diferență este să utilizați funcția corespunzătoare pentru a obține directorul temei pentru a obține adresa fișierului de resurse de sub temă.

poți să foloseștiget_template_directory_urifuncția pentru a obține directorul de teme curent.

Dacă utilizați o temă copil, va trebui să o utilizațiget_stylesheet_directory_uriFuncția primește directorul temei părinte pentru a obține resursele corespunzătoare.