dequeue parent theme script in child theme

  • markf1

    (@markf1)


    5 years, 3 months ago

    I am developing a site using a child theme of twentyninteen. I have it working as it should but I’m trying to clean it up and make it better.

    A script in the parent twentynineteen theme is causing problems when the site is viewed on ipad. I have tried to dequeue it but it still seems to be loading. The script is in wp-content/themes/twentynineteen/js and is touch-keyboard-navigation.js

    Here is my child theme funtions.php:

    <?php
    //* Code goes here

    function enqueue_parent_styles() {
    wp_enqueue_style( ‘parent-style’, get_template_directory_uri().’/style.css’ );
    }

    add_action( ‘wp_enqueue_scripts’, ‘enqueue_parent_styles’ );

    //Dequeue JavaScripts
    function project_dequeue_unnecessary_scripts() {
    wp_dequeue_script( ‘touch-keyboard-navigation’ );
    }
    add_action( ‘wp_print_scripts’, ‘project_dequeue_unnecessary_scripts’, 100 );

    Any help getting this configured correctly to remove script will be much appreciated. Thanks!

Viewing 15 replies - 1 through 15 (of 36 total)
1 2 3
  • Andrew Nevins

    (@anevins)

    WCLDN 2018 Contributor | Volunteer support

    5 years, 3 months ago

    I don’t think you need to dequeue them. Try just replicating the folder structure and put a new ‘touch-keyboard-navigation.js’ file in there, then modify it to your needs.

    Thread Starter markf1

    (@markf1)

    5 years, 3 months ago

    Thanks for your reply Andrew.

    I think I need to dequeue that script. I do not know what modifications might need to be made to it and even if I did I would likely not know how to make the modifications. The script causes a big problem on ipad. I have found other reference on internet about this script not working correctly and causing trouble. Right now I have it removed from the twentyninetee parent theme but I know when the theme gets an update it will reappear. So, I’m thinking I need to dequeue it form the child theme functions.php. I don’t understand why the code I used to do that is not working and how it should be changed.

    Joy

    (@joyously)

    5 years, 3 months ago

    Yes, you need to dequeue it if you don’t want it. Scripts and styles do not work like template file for being loaded. They are explicitly added to a queue, with dependencies determining the order they are output.

    You need to look at the order of execution. If the parent theme setup runs first and then the child’s, or the other way around. The dequeue has to be after the enqueue but before the output. And you need to use the handle ‘twentynineteen-touch-navigation’ so it will get the right one.

    Thread Starter markf1

    (@markf1)

    5 years, 3 months ago

    Hi Joy,
    Thanks for your reply. I’m not sure about the order of execution or how to determine that. You can see the code I have in the child theme functions.php above.

    The script I want to dequeue is called touch-keyboard-navigation.js. I am using ‘touch-keyboard-navigation’ as the handle versus the ‘twentynineteen-touch-navigation’ that you suggest. I think I have that part correct, but I can’t figure out why the script still loads.

    Joy

    (@joyously)

    5 years, 3 months ago

    The handle is the part in quotes. The Twenty Nineteen theme uses the handle ‘twentynineteen-touch-navigation’, so to dequeue it, you have to use that same handle.

    Thread Starter markf1

    (@markf1)

    5 years, 3 months ago

    I’m seeing in:

    wp-content>themes>twentyninetee>js>touch-keyboard-navigation.js

    not seeing twentynineteen-touch-navigation

    Am I looking in the wrong place or…?

    Andrew Nevins

    (@anevins)

    WCLDN 2018 Contributor | Volunteer support

    5 years, 3 months ago

    You don’t need to dequeue the parent theme file.

    The following line of code is in the parent theme functions.php file:

    
wp_enqueue_script( 'twentynineteen-touch-navigation', get_theme_file_uri( '/js/touch-keyboard-navigation.js' ), array(), '1.0', true );

    You need to focus on this bit in particular:

    
get_theme_file_uri( '/js/touch-keyboard-navigation.js' )

    Which says “First check the child theme for this file and if it doesn’t exist, check the parent theme”.

    That means you need only include this named file (with the same directory structure) in your child theme and make no code changes to the functions.php file.

    https://developer.wordpress.org/reference/functions/get_theme_file_uri/

    Joy

    (@joyously)

    5 years, 3 months ago

    Sorry, Andrew, my mistake, I didn’t read all the code…

    Andrew Nevins

    (@anevins)

    WCLDN 2018 Contributor | Volunteer support

    5 years, 3 months ago

    No worries. This is what threw me off in the Twenty Seventeen theme too.

    Joy

    (@joyously)

    5 years, 3 months ago

    I haven’t used those new (4.7) functions, because a) no need, b) in themes you can only check for existing functions for the last 3 versions and I didn’t want to have to go in and change it again, and c) I wanted the theme to run on versions before 4.7.

    • This reply was modified 5 years, 3 months ago by Joy.
    Thread Starter markf1

    (@markf1)

    5 years, 3 months ago

    I think I’m following your instructions. I have the code in the child theme functions.php file as shown above in this topic.

    I have now added to the child theme directory:
    wp-content>themes>twentynineteen-child>js>touch-keyboard-navigation.js

    Still, when I open a page I see with the web dev tools that the script is still being loaded. I do not want this script to load because it causes big problems with site functionality on ipad.

    I can’t seem to get the correct configuration to stop this/dequeue this from loading.

    Andrew Nevins

    (@anevins)

    WCLDN 2018 Contributor | Volunteer support

    5 years, 3 months ago

    Can you link us your site? Or put your source code in JS fiddle?

    Thread Starter markf1

    (@markf1)

    5 years, 3 months ago

    I had removed the touch-keyboard-navigation.js from the parent twentynineteen theme so we can see the site without the problem.

    I have a copy of the site on my localhost that I’m testing this on.

    I have now added the script back so I can give you a link to the site, here is the page that in particular is affected by the script I want to remove. Plus I added the js folder with script in it to the child theme per your suggestion. you can see the funtions.php code above in this topic

    http://ngx249.inmotionhosting.com/~treere6/?page_id=11

    • This reply was modified 5 years, 3 months ago by markf1.
    Andrew Nevins

    (@anevins)

    WCLDN 2018 Contributor | Volunteer support

    5 years, 3 months ago

    It’s working. Look at the path of your JS file. It loads from your Child Theme – that’s what you want right?

    Thread Starter markf1

    (@markf1)

    5 years, 3 months ago

    I’m sorry this isn’t clear- please understand am trying to get rid of that script/stop it from loading. I don’t want it to load from child or parent.

    I want to dequeue it like I am trying to with the funtions.php

Viewing 15 replies - 1 through 15 (of 36 total)
1 2 3
  • The topic ‘dequeue parent theme script in child theme’ is closed to new replies.