0

For some reason I cant seem to enqueue external JS files. I can enqueue external css files but not the JS files. I have a custom theme using the bootstrap css frame work. My functions.php is as follows:

function add_css_scripts(){
    wp_enqueue_style('boot-strap','https://stackpath.bootstrapcdn.com/bootstrap/4.1.0/css/bootstrap.min.css',false);
    wp_enqueue_style('style', get_template_directory_uri() . '/style.css', false, 'all');
    wp_enqueue_style('media', get_template_directory_uri(). '/assets/css/media.css', false, all);

}
add_action('wp_enqueue_scripts', 'add_css_scripts');

/*Jquery Scripst*/
function add_js_scripts(){
    wp_deregister_script( 'jquery' );
    //wp_enqueue_script('jquery', 'https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js', false, '3.3.1', true);
    wp_register_script('jquery', 'https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js', false, '3.3.1', true);
    wp_enqueue_script('jquery');
    wp_register_script('pre', get_template_directory_uri(). '/assets/js/pre.js','1.0.0', array('jquery'), '1.0.0', true);
    wp_enqueue_script('pre');
    //wp_enqueue_script('bootstrap', 'https://maxcdn.bootstrapcdn.com/bootstrap/4.1.0/js/bootstrap.min.js', array('jquery'), '4.1.0', true);
    wp_register_script('bootstrap', 'https://maxcdn.bootstrapcdn.com/bootstrap/4.1.0/js/bootstrap.min.js', array('jquery'), '4.1.0', true);
    wp_enqueue_script('bootstrap');
    //wp_enqueue_script('popper', 'https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.12.9/umd/popper.min.js', array('jquery'), '1.12.9', true);
    wp_register_script('popper', 'https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.12.9/umd/popper.min.js', array('jquery'), '1.12.9', true);
    wp_enqueue_script('popper');
}
add_action('wp_enqueue_scripts','add_js_scripts');

Everything commented out are bits of code I've tried and hasnt work, the wp_deregister('jquery'); works since I need the jquery version 3 and when I add the scripts to my footer.php it works.

bumped to the homepage by Community 2 days ago

This question has answers that may be good or bad; the system has marked it active so that they can be reviewed.

  • What isn't working exactly? – Jacob Peattie Apr 16 '18 at 13:26
  • All the Java script enqueues dont work. Even the local js file enqueue called pre doesnt work. It does work if the original jquery isnt deregistered but I need to use the new version. I have deregistered the jquery in some of my other custom templates but for the life of me I cant figure out whats wrong – Zayd Bhyat Apr 16 '18 at 13:42
0

Using external jQuery is a bad idea. The bundled one is optimized to work better with WordPress.

For your problem, I think the issue is with your way of registering external jquery. Use an empty array instead of false in dependency.

function add_js_scripts(){
    wp_deregister_script( 'jquery' );

    wp_register_script('jquery', 'https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js', array(), '3.3.1', true);

    wp_enqueue_script('pre', get_template_directory_uri(). '/assets/js/pre.js','1.0.0', array('jquery'), '1.0.0', true);

    wp_enqueue_script('bootstrap', 'https://maxcdn.bootstrapcdn.com/bootstrap/4.1.0/js/bootstrap.min.js', array('jquery'), '4.1.0', true);

    wp_enqueue_script('popper', 'https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.12.9/umd/popper.min.js', array('jquery'), '1.12.9', true);

}
add_action('wp_enqueue_scripts','add_js_scripts');  

Also, you don't need to enqueue jquery separately. When you set any script dependent to jquery, it will automatically enqueue it before your script.

  • The boostrap framework im using requires the new jquery and a lot of the functions and other scripts I wish to implement wont work. I was told its fine to deregister the wordpress migratge jquery since its rarelt updated. Ill try your method and see if it makes a difference – Zayd Bhyat Apr 16 '18 at 13:44
  • Nope this didn't seem to work unfortunately – Zayd Bhyat Apr 16 '18 at 13:47
0

instead of using get_template_directory_uri().'/assets/js/pre.js','1.0.0'

try using get_theme_file_uri('/assets/js/pre.js','1.0.0')

It worked for me, for some reason when use get_template_directory_uri() you will get a 403 error

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.