Поддержка → Проблемы и решения → Подключение единичного js в дочернюю тему
Подключение единичного js в дочернюю тему
-
Доброго времени суток!
В родительской теме в поддиректории /assets/js/ есть файл mt-custom-scripts.js правка которого активирует слайдер и вносит изменения в его работу (скорость, пауза), т.е. /assets/js/mt-custom-scripts.js
Вопрос: как перетащить его (файл mt-custom-scripts.js) в дочернюю тему (она активирована и работает со всеми внесенными изменениями — с дочерней темой все в порядке) и активировать? Файл mt-custom-scripts.js из родительской нужно деактивировать.
З.Ы.add_action( 'wp_enqueue_scripts', 'dequeue_and_then_enqueue' ); function dequeue_and_then_enqueue() { wp_dequeue_script( 'mt-custom-scripts.js' ); wp_enqueue_script( 'mt-custom-scripts-fix', get_stylesheet_directory_uri() . '/mt-custom-scripts-fix.js', array( 'jquery' ) ); }
Эта конструкция не работает, т.к., как я догадываюсь, в этом случае не задействованы остальные скрипты из родительской темы.
З.Ы.Ы.
Тапками не кидаться, т.к. я не программист, а делегат конторы, которую обязали иметь официальный сайт…
-
remove_action для оригинала, add_action для правленного файла.
wp_dequeue_script( 'mt-custom-scripts.js' );
Тут должен быть хендлер, а не имя файла. Это раз.
Два. dequeue имеет смысл только после enqueue.
На самом деле достаточно зарегистрировать свой скрипт с тем же хендлером, что и «истребляемый». Но опять же: после.
add_action( 'wp_enqueue_scripts', 'dequeue_and_then_enqueue', 12 ); function dequeue_and_then_enqueue() { wp_enqueue_script( 'mt-custom-scripts', get_stylesheet_directory_uri() . '/mt-custom-scripts-fix.js', array( 'jquery' ) ); }
Спасибо, Юрий, что уделили внимание!
Вот аналог (копия), на которой я пытаюсь, а потом переношу на реальный сайт:
http://q908121m.beget.tech/
На реальном сайте в файл mt-custom-scripts.js внесена правка в родительской теме и это работает без замечаний.
Внес этот кодadd_action( 'wp_enqueue_scripts', 'dequeue_and_then_enqueue', 12 ); function dequeue_and_then_enqueue() { wp_enqueue_script( 'mt-custom-scripts', get_stylesheet_directory_uri() . '/mt-custom-scripts-fix.js', array( 'jquery' ) ); }
в function.php дочерней темы
Измененный файл mt-custom-scripts-fix.js(он точно корректен, т.к. работает на другом сайте, НО в родительской теме) в корневой директории дочерней темы.
Но слайдер не не запускается, а эффекты как бы накладываютсяНа странице грузится и mt-custom-scripts-fix.js (в хедере), и mt-custom-scripts.js (в футере). Возможно, хендлер скрипта не mt-custom-scripts или подключение в теме сделано, скажем так, несколько своеобразно.
Проще оставить модифицированный mt-custom-scripts.js в покое в родительской теме.. Спасибо за помощь, Юрий!
Добрый день!
Если вы хотите полностью исключить родительский файл, попробуйте отозвать его регистрацию с помощью функции
wp_deregister_script()
. Что-то наподобие:function replace_parent_js_scripts() { $handler = 'mt-custom-scripts'; $version = null; // Отключаем вывод родительского скрипта (если он выводится) wp_dequeue_script( $handler ); // Отзываем регистрацию и освобождаем хэндлер wp_deregister_script( $handler ); // Регистрируем скрипт заново, уже со ссылкой на измененный файл wp_register_script( $handler, get_stylesheet_directory_uri() . '/mt-custom-scripts-fix.js', array( 'jquery' ), $version, true ); // Можно здесь же добавить и вывод скрипта, // хотя я бы вызывал его выборочно // в конкретных нужных шаблонах wp_enqueue_script( $handler ); } add_action( 'wp_enqueue_scripts', 'replace_parent_js_scripts', 11 );
Это несколько избыточный подход, но в проблемных случаях лучше писать так.
Пара заметок:
- Иногда «отключенный» скрипт попросту зависает в кэше и в результате даже правильный код не даёт нужного результата. В таких случаях может помочь добавление версии скрипта в переменную $version.
- Часто проблемы возникают из-за путаницы с путями (пропущенный слэш, неправильный относительный путь внутри каталога — например, пропущенная подпапка скриптов «js/» и т.п.). Хорошо бы убедиться, что запрашиваемый файл лежит именно там, откуда вы его запрашиваете (в консоли).
- Юрий верно заметил, что нужно правильно подобрать приоритет add_action() (третий параметр должен быть выше, чем в родительской теме; по-умолчанию там 10, но может оказаться и больше).
- Ответ изменён 4 года, 1 месяц назад пользователем Norske. Причина: разметка
Norske, спасибо за Вашу помощь!
Добавил этот код в function.php в дочерней теме/mt-custom-scripts-fix.js в корне директории дочки
Файл, который нужно отключить /assets/js/mt-custom-scripts.js родительской
Приоритеты ставил и 20 и 9999
Кеш чистил
Слайдер не работаетФайл, который нужно отключить /assets/js/mt-custom-scripts.js родительской
Хендлер посмотрите в родительской, скорее всего, он не
mt-custom-scripts
.Где можно увидеть хендлер?
В содержимом файла mt-custom-scripts.js?jQuery(document).ready(function($) { "use strict"; /** * Color Blog Preloader */ if($('#preloader-background').length > 0) { setTimeout(function(){$('#preloader-background').hide();}, 600); } var grid = document.querySelector( '.color-blog-content-masonry' ), masonry; if ( grid && typeof Masonry !== undefined && typeof imagesLoaded !== undefined ) { imagesLoaded( grid, function( instance ) { masonry = new Masonry( grid, { itemSelector: '.hentry' } ); } ); } /** * Header Search script */ $('.mt-menu-search .mt-search-icon').click(function() { $('.mt-menu-search .mt-form-wrap').toggleClass('search-activate'); }); $('.mt-menu-search .mt-form-close').click(function() { $('.mt-menu-search .mt-form-wrap').removeClass('search-activate'); }); /** * Settings about WOW animation */ var wowOption = color_blogObject.wow_effect; if( wowOption === 'on' ) { new WOW().init(); } /** * Settings about sticky menu */ var stickyOption = color_blogObject.menu_sticky; if( stickyOption === 'on' ) { var windowWidth = $( window ).width(); if( windowWidth < 500 ) { var wpAdminBar = 0; } else { var wpAdminBar = $('#wpadminbar'); } if ( wpAdminBar.length ) { $(".mt-social-menu-wrapper").sticky({topSpacing:wpAdminBar.height()}); } else { $(".mt-social-menu-wrapper").sticky({topSpacing:0}); } } /** * Scroll To Top */ $(window).scroll(function() { if ($(this).scrollTop() > 1000) { $('#mt-scrollup').fadeIn('slow'); } else { $('#mt-scrollup').fadeOut('slow'); } }); $('#mt-scrollup').click(function() { $("html, body").animate({ scrollTop: 0 }, 600); return false; }); /** * Slider scripts */ $('.front-slider').lightSlider({ pager: false, auto: false, loop: true, item: 1, controls: true, slideMargin:0, rtl:true, nextHtml: '<span class="icon-prev"><i class="fa fa-angle-left"></i></span>', prevHtml: '<span class="icon-next"><i class="fa fa-angle-right"></i></span>', onSliderLoad: function() { $('.front-slider').removeClass('cS-hidden'); } }); /** * Slider scripts */ $('.mt-gallery-slider').lightSlider({ pager: false, auto: false, loop: true, item: 1, controls: true, }); /** * Responsive */ $('.menu-toggle').click(function(event) { $('#site-navigation').slideToggle('slow'); }); /** * responsive sub menu toggle */ $('#site-navigation .menu-item-has-children').append('<span class="sub-toggle"> <i class="fa fa-angle-right"></i> </span>'); $('#site-navigation .page_item_has_children').append('<span class="sub-toggle"> <i class="fa fa-angle-right"></i> </span>'); $('#site-navigation .sub-toggle').click(function() { $(this).parent('.menu-item-has-children').children('ul.sub-menu').first().slideToggle('1000'); jQuery(this).parent('.page_item_has_children').children('ul.children').first().slideToggle('1000'); $(this).children('.fa-angle-right').first().toggleClass('fa-angle-down'); }); /** * Slider Section dynamic height script */ $(window).on('load', function() { if ($(window).width() > 839) { $(".front-slider-wrapper").each(function() { var imageHeight = $(this).height(); $(this).find(".slider-post-wrap").css('height', imageHeight); $(this).find(".front-slider ").css('height', imageHeight); }); } }); });
Где можно увидеть хендлер?
Там, где скрипт подключается. Первый параметр вызова wp_enqueue_script()
Перекопал все файлы темы, к сожалению, по Ctrl+F в содержимом файлов wp_enqueue_script() не найдено
а без скобок?
Скобки принято дописывать, чтобы обозначить, что имеется в виду функция, а не константа или еще что-то.
Искал со скобками, а нужно без?
Просто найдите строку, в которой есть ‘wp_enqueue_script’ и ‘mt-custom-scripts.js’
Нашел в файле template-functions.php
wp_enqueue_script( 'color-blog-custom-scripts', get_template_directory_uri() .'/assets/js/mt-custom-scripts.js', array('jquery'), esc_attr( $color_blog_theme_version ), true );
- Тема «Подключение единичного js в дочернюю тему» закрыта для новых ответов.