Enqueuing External Javascript functions.php

admin管理员组

文章数量:1332619

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','.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', '.3.1/jquery.min.js', false, '3.3.1', true);
    wp_register_script('jquery', '.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', '.1.0/js/bootstrap.min.js', array('jquery'), '4.1.0', true);
    wp_register_script('bootstrap', '.1.0/js/bootstrap.min.js', array('jquery'), '4.1.0', true);
    wp_enqueue_script('bootstrap');
    //wp_enqueue_script('popper', '.js/1.12.9/umd/popper.min.js', array('jquery'), '1.12.9', true);
    wp_register_script('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.

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/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/ajax/libs/jquery/3.3.1/jquery.min.js', false, '3.3.1', true);
    wp_register_script('jquery', 'https://ajax.googleapis/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/bootstrap/4.1.0/js/bootstrap.min.js', array('jquery'), '4.1.0', true);
    wp_register_script('bootstrap', 'https://maxcdn.bootstrapcdn/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/ajax/libs/popper.js/1.12.9/umd/popper.min.js', array('jquery'), '1.12.9', true);
    wp_register_script('popper', 'https://cdnjs.cloudflare/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.

• functions
• javascript
• wp-enqueue-script

Share Improve this question asked Apr 16, 2018 at 13:22 Zayd BhyatZayd Bhyat 8922 silver badges1515 bronze badges 2

• What isn't working exactly? – Jacob Peattie Commented Apr 16, 2018 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 Commented Apr 16, 2018 at 13:42

Add a comment  | 

2 Answers 2

Sorted by: Reset to default 2

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

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/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/bootstrap/4.1.0/js/bootstrap.min.js', array('jquery'), '4.1.0', true);

    wp_enqueue_script('popper', 'https://cdnjs.cloudflare/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.

本文标签： Enqueuing External Javascript functionsphp