Jak WordPress správně zavádí JavaScript?Vlastní načítání souborů JS a CSS

PoužitíWeb WordPressprogramátoři, vývojWordPress pluginNebo při přizpůsobení motivu WordPress se odkazuje na některé skriptovací zdroje JavaScriptu a CSS.

• Obvykle lidé používají značky link, skriptů přímo pro HTML.
• Ve skutečnosti má WordPress vestavěné sofistikované funkce a metody pro odkazování na skripty.
• Takže používání vestavěných referencí metod WordPress je profesionálnější a rozšiřitelnější.

Špatná metoda citování

Existují dva běžné způsoby citování, je to v pořádku, jen to není dokonalé ani rozumné.

Typ 1:značky odkazu odkazují na soubory CSS

• Značky skriptu používají soubory JS.Není zde podrobně.

Typ 2:Použijte funkci wp_head

• Funkce wp_head se používá k výstupu nějakého vlastního nebo systémem definovaného obsahu.
• K odkazování na tento soubor někdy používáme následující kód:

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

• Zkopírujte výše uvedený kód do souboru functions.php, abyste odkazovali na odpovídající soubory.

Mechanismus zdrojů WordPress Enqueue Scripts

Jak všichni víme, WordPress má spoustu pluginů:

• Téměř každý plugin odkazuje na nějaký zdrojový soubor.
• Nevyhnutelně dojde ke konfliktům mezi zdroji odkazovanými dvěma pluginy, které se stanou nestabilními a mohou ovlivnit efektivitu.

Použijte funkci wp_enqueue_script

• Chcete-li odkazovat na zdroj ve WordPress, měli byste použítwp_enqueue_scriptFunkce, která má v názvu zařazené nebo seřazené funkce slovo enqueue.
• S tímto způsobem řazení zdrojů do fronty WordPress (Enqueue Scripts) jsou odkazy odděleny od odpovídajících souborů a základního kódu.
• Pokud chce uživatel zdroj deaktivovat, může jej smazat, upravit a okomentovat, aniž by jej upravoval ze základního kódu.

Také některé běžně používané knihovny jako jQuery, jQuery UI atd. jsou zabudovány do WordPressu.

K přímému volání vestavěné knihovny můžeme použít funkci wp_enqueue_script, což ušetří kód a čistší specifikaci.

Pokud tuto funkci používáte k odkazování na své vlastní soubory JS a CSS, musíte ji použítwp_register_scriptFunkce zaregistruje identifikátor (handle) a poté jej použijewp_enqueue_scriptFunkce volá zdroj odpovídající tomuto příznaku.

Jak správně importovat soubory JS a CSS do WordPress?

WordPress poskytuje rozumné metody importu pro metody JS a CSS.

Pro import souboru plugin.css do pluginu ▼ můžete použít následující kód

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

Výše uvedené používá funkci wp_register_script k vytvoření prostředku s identifikátorem plugin_stylesheet.

Poté přidejte jeho požadavky ve frontě dowp_enqueue_scriptsakce jsou v provozu.

Přestože je název funkce skript, nemá nic společného s typem souboru prostředků a je platný pro CSS i JS.

Funkce wp_register_script opravdu není tak jednoduchá, může mít pět parametrů:

1) $handle:Identifikátor zdroje.

• 由wp_enqueue_scriptpřevod.

2) $src:Umístění zdroje.

• Relativní nebo absolutní adresy používají k získání adres vestavěné funkce WordPress atd.
• BěžnýPolohovánífunkce máplugins_url,get_template_directory_uriPočkejte.

3) $deps:spolehnout se.

• Pokud odkazujete na plugin jQuery a potřebujete se při sestavování spolehnout na jQuery, musíte vyplnit jQuery.
• Všimněte si, že je předán jako pole.

4) $ver:Verze zdroje, volitelná.

5) $in_footer:Dáváš to na dno?

• Normálně by měly být soubory JS umístěny na konci stránky, tento parametr můžete nastavit na hodnotu True, ponechat jej prázdné nebo na hodnotu False, chcete-li výstup na začátek.

Podívejme se na úplnější příklad referenčního souboru JavaScript ▼

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

Témata WordPress používají k importu zdrojů wp_enqueue_script

Programátoři ve vývoji témat WordPress, použitíwp_enqueue_scriptImport zdrojů.

• Výše uvedené příklady jsou příklady odkazovaných zdrojů pro vývoj pluginů WordPress.
• Metoda uvedená v tématu je podobná.

Hlavním rozdílem je použití odpovídající funkce k získání adresáře tématu pro získání adresy souboru prostředků pod tématem.

Můžeš použítget_template_directory_urik získání aktuálního adresáře motivu.

Pokud používáte podřízené téma, budete muset použítget_stylesheet_directory_uriFunkce získá adresář nadřazeného tématu, aby získala odpovídající prostředky.