wordpress - ワードプレスのカスタムページにcssとjqueryを追加する

Question

wordpress.org を使用しています。インデックス ファイルを使用してカスタム ページを作成し、css および javascript ファイルへの参照をインデックス ファイルに含めました。しかし、それらの複数の css および javascript ファイルをワードプレスに追加する方法。

Answer 1

まず、wp_enqueue_script関数を見てください。

次のコードをテーマの functions.phpに挿入すると、テーマの js ディレクトリから custom_script.js が読み込まれます (このスクリプトは jquery に依存します)。

function my_scripts_method() {
    wp_enqueue_script(
        'custom-script',
        get_template_directory_uri() . '/js/custom_script.js',
        array('jquery')
    );
}
add_action('wp_enqueue_scripts', 'my_scripts_method');

スタイルシートを読み込むには、同じフックを使用しますが、wp_enqueue_style 関数を使用します。

function my_styles_method() {
    wp_enqueue_style(
        'custom-script',
        get_template_directory_uri() . '/css/custom_style.css'
    );
}
add_action('wp_enqueue_scripts', 'my_styles_method');

または、これら 2 つの呼び出しを 1 つにマージできます。

function my_scripts_and_styles_method() {
    wp_enqueue_script(
        'custom-script',
        get_template_directory_uri() . '/js/custom_script.js',
        array('jquery')
    );
    wp_enqueue_style(
        'custom-script',
        get_template_directory_uri() . '/css/custom_style.css'
    );
}
add_action('wp_enqueue_scripts', 'my_scripts_and_styles_method');

エンキューする前にwp_register_scriptを実行しても問題ありませんが、必須ではありません