Вопрос или проблема
Я создал дочернюю тему на основе оригинальной родительской темы. Завершив работу, я узнал, что стандартная практика в индустрии — создавать дочернюю тему (желательно с самого начала). Мне удалось успешно перенести 99,9% темы в дочернюю, однако по какой-то причине я не могу перенести один единственный js файл (main.js) в папку активов дочерней темы. Изображения, стилевые таблицы, шрифты и т.д. были успешно перенесены в дочернюю тему, но если я переношу файл main.js, мой параллакс-скролл (тест) перестает работать. Мне приходится оставлять этот файл в его оригинальном местоположении в родительской папке, чтобы эта функция работала. Это не идеально.
Я попробовал все мыслимые комбинации функций enqueue, register и wpb_adding_scripts(), которые смог найти, но ничего не работает. Этот файл, похоже, работает только когда он находится в папке родительской темы, почему так?
Замечание: main.js загружается на моей странице представления, но все равно не работает, когда файл находится в дочерней теме…
h
Любая помощь будет оценена
Спасибо
В строке 18 файла functions.php вашей дочерней темы вы подключаете main.js с помощью get_template_directory_uri(). Эта функция возвращает путь к вашей родительской теме. Попробуйте заменить ее на get_stylesheet_directory_uri(), которая вернет путь к корневой директории вашей дочерней темы.
Не могу вас винить за то, что не заметили разницу. Запись на developer.wordpress.org для get_template_directory_uri() довольно скудна на детали. Запись на codex.wordpress.org для get_template_directory гораздо яснее, и две функции тесно связаны (первая возвращает URL, вторая возвращает путь к файловой системе), так что вы можете сделать вывод о том, что делает одна, исходя из другой.
Из записи кода для get_template_directory:
Получает абсолютный путь (например: /home/user/public_html/wp-content/themes/my_theme) к директории текущей темы.
Если используется дочерняя тема, будет возвращен абсолютный путь к директории родительской темы. Используйте get_stylesheet_directory(), чтобы получить абсолютный путь к директории дочерней темы.
Также, в будущем, пожалуйста, постарайтесь копировать и вставлять код в текст вопроса вместо того, чтобы делать скриншоты; так будет легче для нас копировать, редактировать и отвечать 🙂
Ответ или решение
Как загружать файл main.js из дочерней темы WordPress
Создание дочерней темы в WordPress — это правильный шаг в веб-разработке, позволяющий сохранять изменения независимо от обновлений родительской темы. Перемещение файлов, в частности JavaScript, из родительской темы в дочернюю может иногда вызвать проблемы, как в вашем случае с файлом main.js. Рассмотрим, как правильно загрузить этот файл и возможные причины возникновения проблем.
1. Причины неработоспособности скрипта
На первый взгляд, если ваш файл main.js загружается при его размещении в родительской теме, но не работает при переносе в дочернюю, возможно, существует несколько причин:
- Неправильный путь к файлу: Если вы используете
get_template_directory_uri(), это приведет к обращению к родительской теме, что может быть причиной проблемы. - Зависимости других скриптов: Убедитесь, что другие скрипты, от которых зависит ваш main.js, также загружаются.
- Проблемы с порядком загрузки: Возможно, ваш скрипт загружается в неправильное время (например, до jQuery, если вы его используете).
2. Правильное использование функций WordPress
Чтобы ваш скрипт загружался корректно из дочерней темы, необходимо использовать правильные функции для получения URL:
function my_child_theme_scripts() {
wp_enqueue_script('main-js', get_stylesheet_directory_uri() . '/assets/js/main.js', array('jquery'), null, true);
}
add_action('wp_enqueue_scripts', 'my_child_theme_scripts');get_stylesheet_directory_uri(): Эта функция возвращает URL-адрес вашей дочерней темы, что и нужно для правильного подключения файлов.array('jquery'): Если ваш скрипт зависит от jQuery, указывайте его как зависимость, чтобы загрузить его прежде.true: Это указывает WordPress загружать скрипт внизу страницы, что обычно рекомендуется.
3. Проверка консоли разработчика
Полезной практикой является открытие консоли разработчика (используйте F12 в большинстве браузеров) и проверка на наличие ошибок JavaScript. Также лучше проверить, действительно ли файл main.js загружается из дочерней темы, а не из родительской:
- В консоли перейдите на вкладку "Network".
- Отфильтруйте по "JS" и найдите main.js.
- Убедитесь, что URL содержит путь к дочерней теме. Например:
https://ваш-сайт/wp-content/themes/ваша-дочерняя-тема/assets/js/main.js.
4. Варианты отладки
Если скрипт по-прежнему не работает:
- Отключите кэш: Иногда кэш может мешать динамической загрузке файлов, отключите его и попробуйте снова.
- Проверьте на конфликты: Убедитесь, что ваш скрипт не конфликтует с другими скриптами или библиотеками.
- Логи ошибок: Проверьте логи ошибок сервера и консоли браузера, чтобы выявить конкретные проблемы.
Заключение
Следуя приведенным рекомендациям, вы сможете успешно загрузить файл main.js из вашей дочерней темы, а также устранить возможные проблемы. Помните о правильном обращении к функциям WordPress при работе с темами и их структурами. Если у вас возникнут дополнительные вопросы или потребуется помощь, не стесняйтесь обращаться к сообществу разработчиков WordPress.