0

I want to override function in child theme to remove specific scripts, which is defined inside a class in parent theme.

Parent theme functions.php

class Theme_Assets extends Theme_Base {

    /**
     * Hold data for wa_theme for frontend
     * @var array
     */
    private static $theme_json = array();

    /**
     * [__construct description]
     * @method __construct
     */
    public function __construct() {

        // Frontend
        $this->add_action( 'wp_enqueue_scripts', 'dequeue', 2 );
        $this->add_action( 'wp_enqueue_scripts', 'register' );
        $this->add_action( 'wp_enqueue_scripts', 'enqueue' );

        self::add_config( 'uris', array(
            'ajax'    => admin_url('admin-ajax.php', 'relative')
        ));
    }

    /**
     * Unregister Scripts and Styles
     * @method dequeue
     * @return [type]  [description]
     */
    public function dequeue() {

    }

    /**
     * Register Scripts and Styles
     * @method register
     * @return [type]   [description]
     */
    public function register() {

        $this->script( 'bootstrap', $this->get_vendor_uri( 'bootstrap/js/bootstrap.min.js' ), array( 'jquery' ) );
        $this->script( 'intersection-observer', $this->get_vendor_uri( 'intersection-observer.js' ), array( 'jquery' ) );
        $this->script( 'jquery-lazyload', $this->get_vendor_uri( 'lazyload.min.js' ), array( 'jquery' ) );
        $this->script( 'imagesloaded', $this->get_vendor_uri( 'imagesloaded.pkgd.min.js' ), array( 'jquery' ) );
        $this->script( 'jquery-vivus', $this->get_vendor_uri( 'vivus.min.js' ), array( 'jquery' ) );
        $this->script( 'splittext', $this->get_vendor_uri( 'greensock/utils/SplitText.min.js' ), array( 'jquery' ) );
        $this->script( 'scrollmagic', $this->get_vendor_uri( 'scrollmagic/ScrollMagic.min.js' ), array( 'jquery' ) );
        $this->script( 'jquery-tinycolor', $this->get_vendor_uri( 'tinycolor-min.js' ), array( 'jquery' ) );
        
        $deps = array(
            'bootstrap',
            'intersection-observer',
            'imagesloaded',
            'scrollmagic',
        );
        
        // LazyLoad
        $enable_lazyload = theme_helper()->get_option( 'enable-lazy-load' );
        if( 'on' === $enable_lazyload ) {
            array_push( $deps,
                'jquery-lazyload'
            );
        }
        // Header Js
        $enable_header = theme_helper()->get_option( 'header-enable-switch' );
        if( 'on' === $enable_header ) {
            array_push( $deps,
                'jquery-tinycolor'
            );
        }

        if( is_page() ) {
            array_push( $deps,
                'splittext',
                'jquery-tinycolor'
            );
        }
    }

    /**
     * Enqueue Scripts and Styles
     * @method enqueue
     * @return [type]  [description]
     */
    public function enqueue() {

        if ( is_singular() && comments_open() && get_option( 'thread_comments' ) ) {
            wp_enqueue_script( 'comment-reply' );
        }
    }
    
    // Register Helpers ----------------------------------------------------------
    public function script( $handle, $src, $deps = null, $in_footer = true, $ver = null ) {
        wp_register_script( $handle, $src, $deps, $ver, $in_footer);
    }

    public function style( $handle, $src, $deps = null, $ver = null, $media = 'all' ) {
        wp_register_style( $handle, $src, $deps, $ver, $media );
    }

    // Uri Helpers ---------------------------------------------------------------

    public function get_theme_uri($file = '') {
        return get_template_directory_uri() . '/' . $file;
    }

    public function get_child_uri($file = '') {
        return get_stylesheet_directory_uri() . '/' . $file;
    }

    public function get_css_uri($file = '') {
        return $this->get_theme_uri('assets/css/'.$file.'.css');
    }

    public function get_elements_uri( $file = '' ) {
        return $this->get_theme_uri( 'assets/css/elements/' . $file . '.css' );
    }

    public function get_js_uri($file = '') {
        return $this->get_theme_uri('assets/js/'.$file.'.js');
    }

    public function get_vendor_uri($file = '') {
        return $this->get_theme_uri('assets/vendors/'.$file);
    }
}

new Theme_Assets;

I want to remove 'splittext' and 'jquery-tinycolor' scripts by inheriting dequeue function in parent theme but it remove all other scripts

Here is Child theme's code in functions.php

add_action( 'after_setup_theme', function() {

   class D extends Theme_Assets{

   function __construct(){
      $this->add_action( 'wp_enqueue_scripts', 'dequeue', 20 );
   }
       
      public function dequeue(){
         wp_dequeue_script('jquery-tinycolor');
         wp_deregister_script('jquery-tinycolor');
         wp_dequeue_script('splittext');
         wp_deregister_script('splittext');
      }
   }

   new D();
});

Any helps are appreciate.

4
  • This either scripts likely depend on the ones you’re trying to dequeue. If that’s the case then they probably would let work if you dequeued them anyway. May 8, 2021 at 6:31
  • So that means I can't dequeue these scripts?
    – Hung PD
    May 8, 2021 at 7:35
  • Depends in the specific circumstances of the parent theme, but possibly not. May 8, 2021 at 7:42
  • Hope you can give me solutions or any ideas?
    – Hung PD
    May 8, 2021 at 8:15

2 Answers 2

0

You will need to dequeue it after it has been enqueued.

function wpse387889_dequeue_scripts() {

    wp_dequeue_script('jquery-tinycolor');
    wp_deregister_script('jquery-tinycolor');
    wp_dequeue_script('splittext');
    wp_deregister_script('splittext');
    
}
add_action( 'wp_enqueue_scripts', 'wpse387889_dequeue_scripts', 99 );
3
  • I tried but it will remove all other scripts.
    – Hung PD
    May 8, 2021 at 6:19
  • @HungPD It shouldn't. No need to extend the theme class, just copy/pasting this bit of code in your child theme's functions.php would be suffice.
    – Abhik
    May 8, 2021 at 6:51
  • I tried your method before but it still not working
    – Hung PD
    May 8, 2021 at 7:34
0

When working with classes and actions/filters, the callback is a bit different.

Usually it's like this

add_action('wp_enqueue_scripts', 'my_callback_func');
function my_callback_func () {}

But in classes you need to add the instance (if using new) or class name (if using method as static)

In your case

$this->add_action( 'wp_enqueue_scripts', 'dequeue', 20 );

Needs to be replaced to this

add_action( 'wp_enqueue_scripts', [$this, 'dequeue'], 20 );

My guess is, wordpress could not find the dequeue callback function and, by default, dequeued all scripts. Or maybe never loads any script/style in the first place.

5
  • Thank you, I tried your way but it still not working. class D extends Theme_Assets{ function __construct(){ add_action( 'wp_enqueue_scripts', [$this, 'dequeue'], 20 ); } public function dequeue(){ wp_dequeue_script('jquery-tinycolor'); wp_deregister_script('jquery-tinycolor'); wp_dequeue_script('splittext'); wp_deregister_script('splittext'); } } new D();
    – Hung PD
    May 10, 2021 at 13:46
  • Don't use $this->add_action, only add_action May 10, 2021 at 13:48
  • Yes, I did. only add_action only Do you need anything else?
    – Hung PD
    May 10, 2021 at 13:48
  • The comment you just posted contains $this->add_action, thats why i said don't use it May 10, 2021 at 13:49
  • Thank you, I edited comment and in my code, but still doesn't work :(
    – Hung PD
    May 10, 2021 at 13:50

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.