Enqueue Javascript in functions.php

Question

I am enqueuing javascript files with functions.php, one of the is a external link and another is not.

They are both loading all right, but it's loading the internal file before the external, so there're some bits of the code that are not working.

This is the code:

function _tandt_scripts() {
  $my_js_ver  = date("ymd-Gis");

  wp_deregister_script( 'jquery' );
  wp_register_script('jquery', 'https://cdnjs.cloudflare.com/ajax/libs/jquery/2.1.3/jquery.min.js', array(), '2.1.3', true);

  wp_enqueue_script( '_tandt-main', get_template_directory_uri() . '/_assets/js/main/min/main-min.js', array(), $my_js_ver, true );

  if ( is_singular() && comments_open() && get_option( 'thread_comments' ) ) {
      wp_enqueue_script( 'comment-reply' );
  }
}

add_action( 'wp_enqueue_scripts', '_tandt_scripts' );

As you can see in the screenshot, it's loading the 'main-min.js' first, when it should be the other way around.

screenshot

because you didn't enqueue jquery, you just registered it.

Taha Paksu
– Taha Paksu

2018-05-03 14:48:49 +00:00
Commented May 3, 2018 at 14:48 — Taha Paksu
– Taha Paksu, Commented May 3, 2018 at 14:48
Wrote it as an answer. You can accept that.

Taha Paksu
– Taha Paksu

2018-05-03 14:51:44 +00:00
Commented May 3, 2018 at 14:51 — Taha Paksu
– Taha Paksu, Commented May 3, 2018 at 14:51

Taha Paksu · Accepted Answer · 2018-05-03 14:51:03Z

1

You re-registered the jQuery script but you didn't enqueue it to the page.

Add this line after wp_register_script:

wp_enqueue_script("jquery");

and change this line:

wp_enqueue_script( '_tandt-main', get_template_directory_uri() .
    '/_assets/js/main/min/main-min.js', array(), $my_js_ver, true );

to:

wp_enqueue_script( '_tandt-main', get_template_directory_uri() . 
    '/_assets/js/main/min/main-min.js', array("jquery"), $my_js_ver, true );

to have jquery as a dependency.

answered May 3, 2018 at 14:51

Taha Paksu

15.6k2 gold badges50 silver badges83 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

Dan Nagle · Accepted Answer · 2018-05-03 14:52:59Z

0

You haven't specified that the second script is dependent on the first.

wp_enqueue_script( '_tandt-main',
    get_template_directory_uri() . '/_assets/js/main/min/main-min.js',
    array(), $my_js_ver, true );

This line should be changed to include the jquery dependemcy.

wp_enqueue_script( '_tandt-main',
    get_template_directory_uri() . '/_assets/js/main/min/main-min.js',
    array('jquery'), $my_js_ver, true );

See the WordPress documentation for further details: wp_enqueue_script()

answered May 3, 2018 at 14:52

Dan Nagle

5,4751 gold badge20 silver badges36 bronze badges

Collectives™ on Stack Overflow

Enqueue Javascript in functions.php

2 Answers 2

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related