Поддержка Проблемы и решения Подключение единичного 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' ) );
    }
    

    Эта конструкция не работает, т.к., как я догадываюсь, в этом случае не задействованы остальные скрипты из родительской темы.
    З.Ы.Ы.
    Тапками не кидаться, т.к. я не программист, а делегат конторы, которую обязали иметь официальный сайт…

Просмотр 15 ответов — с 1 по 15 (всего 32)
  • remove_action для оригинала, add_action для правленного файла.

    Модератор Yuri

    (@yube)

    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(он точно корректен, т.к. работает на другом сайте, НО в родительской теме) в корневой директории дочерней темы.
    Но слайдер не не запускается, а эффекты как бы накладываются

    • Ответ изменён 4 года, 1 месяц назад пользователем pe4a1ni.
    • Ответ изменён 4 года, 1 месяц назад пользователем pe4a1ni.
    Модератор Yuri

    (@yube)

    На странице грузится и 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
    Кеш чистил
    Слайдер не работает

    Модератор Yuri

    (@yube)

    Файл, который нужно отключить /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);
                });
            }
        });
    
    });
    
    Модератор Yuri

    (@yube)

    Где можно увидеть хендлер?

    Там, где скрипт подключается. Первый параметр вызова wp_enqueue_script()

    Перекопал все файлы темы, к сожалению, по Ctrl+F в содержимом файлов wp_enqueue_script() не найдено

    Модератор Yuri

    (@yube)

    а без скобок?

    Скобки принято дописывать, чтобы обозначить, что имеется в виду функция, а не константа или еще что-то.

    Искал со скобками, а нужно без?

    Модератор Yuri

    (@yube)

    Просто найдите строку, в которой есть ‘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 );
    
Просмотр 15 ответов — с 1 по 15 (всего 32)
  • Тема «Подключение единичного js в дочернюю тему» закрыта для новых ответов.