Я хочу подключить .js файл в дочернюю тему

Question

Я хочу подключить .js файл в дочернюю тему

5 февр. 2015 г., 12:08:29

Просмотры: 89.6K

Голосов: 22

Я пытаюсь подключить пользовательский .js файл в каталоге моей дочерней темы.

В файле functions.php моей дочерней темы я нашел следующий код

/* После этого вы можете переопределить подключаемые функции Accessible Zen или добавить свои собственные.
 * Помните, старайтесь сохранять доступность! :)
 *
 */
add_action( 'wp_enqueue_scripts', 'theme_enqueue_styles' );
function theme_enqueue_styles() {
    wp_enqueue_script( 'custom-script.js', 'js/custom-script.js', array('jquery') );
    wp_enqueue_style( 'parent-style', get_template_directory_uri() . '/style.css' );
    wp_enqueue_style( 'child-style', get_stylesheet_uri(), array( 'parent-style' ) );
}

где только эта часть была реализована мной и должна загружать мой custom.script.js из папки js/

wp_enqueue_script( 'custom-script.js', 'js/custom-script.js', array('jquery') );

К сожалению, это не работает, кто-нибудь может помочь?

*Обновление 2

Теперь код выглядит так и работает, он не работал, когда я просто добавил функцию к другому add_action. Спасибо всем за помощь! Тем не менее, я задаюсь вопросом, нет ли способа немного сократить этот код.

add_action( 'wp_enqueue_scripts', 'theme_enqueue_styles' );
function theme_enqueue_styles() {
    wp_enqueue_style( 'parent-style', get_template_directory_uri() . '/style.css' );
    wp_enqueue_style( 'child-style', get_stylesheet_uri(), array( 'parent-style' ) );
}

/*добавляю мой пользовательский jquery скрипт*/
add_action( 'wp_enqueue_scripts', 'menu_scripts' );
function menu_scripts() {
wp_enqueue_script( 'responsive-menu', get_bloginfo( 'stylesheet_directory' ) . '/js/responsive-menu.js', array( 'jquery' ), '1.0.0' );
wp_enqueue_script(
    'custom-script',
    get_stylesheet_directory_uri() . '/js/custom-script.js',
    array( 'jquery' )
);
        }

Для чего эта строка?

wp_enqueue_script( 'responsive-menu', get_bloginfo( 'stylesheet_directory' ) . '/js/responsive-menu.js', array( 'jquery' ), '1.0.0' );

Она необходима?

MrKainig

431

jquery javascript

Комментарии

wp_enqueue_script( 'custom-script.js', get_stylesheet_directory_uri() . 'js/custom-script.js', array('jquery') );

Pieter Goosen

5 февр. 2015 г. 12:12:31

@Pieter Я применил ваши изменения, но это всё ещё не работает. Вот что у меня есть в моем .js файле, и это работает, если я вставлю это напрямую в page.php, например: <script> if (jQuery) {

alert("Библиотека jQuery загружена!");

} else {

alert("Библиотека jQuery не найдена!");

} </script>

MrKainig

5 февр. 2015 г. 12:19:48

@Pieter Хорошо, я поместил код в вопрос

MrKainig

5 февр. 2015 г. 12:29:44

Удалите теги script из вашего js-файла

Pieter Goosen

5 февр. 2015 г. 12:34:03

Все ответы на вопрос

Комментарии

Почему вы не используете get_stylesheet_directory_uri()?

Pieter Goosen

5 февр. 2015 г. 12:33:24

Оба варианта работают, согласно моим тестам.

Brad Dalton

5 февр. 2015 г. 12:37:18

Я попробовал первый вариант, он не сработал. Можешь, пожалуйста, опубликовать полный блок кода (включая мои существующие и работающие enqueues)? Потому что я не знаю, как правильно внедрить твой код в уже имеющийся у меня functions.php

MrKainig

5 февр. 2015 г. 12:37:46

Да, они работают, но get_stylesheet_directory_uri() быстрее :-)

Pieter Goosen

5 февр. 2015 г. 12:39:15

Это всего лишь рабочий пример. Вам потребуется немного поработать самостоятельно, чтобы понять, как это работает с вашим кодом. Теперь вы можете переработать свой код для загрузки скриптов в вашей теме.

Brad Dalton

5 февр. 2015 г. 12:42:18

Показать остальные 6 комментариев

Проверьте ваши хуки (handles)! Скрипт может не загрузиться, если вы используете хук, который уже занят другим элементом. Если всё выглядит правильно, ошибок нет, но скрипт не загружается, проверьте установку на наличие других элементов, использующих тот же хук.

В моём случае, так как я расширяю родительскую тему через дочернюю, я (по глупости, о чём теперь жалею!) придерживался тех же соглашений по именованию, что и родительская тема. Урок усвоен!

Adam Lavery

111

3 июн. 2020 г. 13:10:57

Обычно я делаю так:

Перейдите в дочернюю тему

создайте папку js внутри дочерней темы
создайте файл script.js внутри папки js

затем вставьте этот код в файл script.js:

add_action( 'wp_enqueue_scripts', 'custom_scripts', 10 );
function custom_scripts() {
    wp_enqueue_script('custom_javascript', get_stylesheet_directory_uri() . '/js/script.js', array('jquery'), '1.0.0', true );
}

jozef koko

21

16 апр. 2021 г. 19:07:59

Brad Dalton 6.97K · Accepted Answer · 2015-02-05T12:30:19Z

Вот рабочий пример:

add_action( 'wp_enqueue_scripts', 'menu_scripts' );
function menu_scripts() {
wp_enqueue_script( 'responsive-menu', get_bloginfo( 'stylesheet_directory' ) . '/js/responsive-menu.js', array( 'jquery' ), '1.0.0' );
wp_enqueue_script(
    'custom-script',
    get_stylesheet_directory_uri() . '/js/custom_script.js',
    array( 'jquery' )
);
        }

Или так, что по всей видимости загружается быстрее:

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

add_action( 'wp_enqueue_scripts', 'my_scripts_method' );

Источник http://codex.wordpress.org/Function_Reference/wp_enqueue_script

get_template_directory_uri() работает только в родительской теме.