How to add multiple script on functions.php in wordpress child theme?

0
votes

I did try to put my scripts in functions.php but its not showing only the font awesome and all-script.js but the other script is not working. I want to add 5 more script. How do i do that. i think i made some mistake here. Im not a coder so i hope you understand guys. Thank you

//enqueues our locally supplied font awesome stylesheet
function enqueue_our_required_stylesheets(){
    wp_enqueue_style('font-awesome', get_stylesheet_directory_uri() . '/assets/css/font-awesome.min.css'); 
    wp_enqueue_script( 'script', get_stylesheet_directory_uri() . '/assets/js/all-script.js');
    wp_enqueue_script( 'script', get_stylesheet_directory_uri() . '//cdnjs.cloudflare.com/ajax/libs/jquery/2.0.2/jquery.min.js');
    wp_enqueue_script( 'script', get_stylesheet_directory_uri() . '/libs/jquery/scrpt-1.js');
    wp_enqueue_script( 'script', get_stylesheet_directory_uri() . '/libs/jquery/scrpt-2.js');
    wp_enqueue_script( 'script', get_stylesheet_directory_uri() . '/libs/jquery/scrpt-3.js');
    wp_enqueue_script( 'script', get_stylesheet_directory_uri() . '/libs/jquery/scrpt-4.js');
    wp_enqueue_script( 'script', get_stylesheet_directory_uri() . '/libs/jquery/scrpt-5.js');
}
add_action('wp_enqueue_scripts','enqueue_our_required_stylesheets');
3
javascriptphpjquerywordpress

3 Answers

3
votes

Try This Line of Code:

function enqueue_our_required_stylesheets(){
   wp_enqueue_style('font-awesome', get_stylesheet_directory_uri() . '/assets/css/font-awesome.min.css'); 
   wp_enqueue_script( 'script-all', get_stylesheet_directory_uri() . '/assets/js/all-script.js');
   wp_dequeue_script( 'jquery' );
   wp_enqueue_script( 'script-jquery', get_stylesheet_directory_uri() . '//cdnjs.cloudflare.com/ajax/libs/jquery/2.0.2/jquery.min.js');
   wp_enqueue_script( 'script-1', get_stylesheet_directory_uri() . '/libs/jquery/scrpt-1.js');
   wp_enqueue_script( 'script-2', get_stylesheet_directory_uri() . '/libs/jquery/scrpt-2.js');
   wp_enqueue_script( 'script-3', get_stylesheet_directory_uri() . '/libs/jquery/scrpt-3.js');
   wp_enqueue_script( 'script-4', get_stylesheet_directory_uri() . '/libs/jquery/scrpt-4.js');
   wp_enqueue_script( 'script-5', get_stylesheet_directory_uri() . '/libs/jquery/scrpt-5.js');
}
add_action('wp_enqueue_scripts','enqueue_our_required_stylesheets');
1
votes

You need to use a unique identifier for each script (first parameter for wp_enqueue_script). Since you've used script in each case, WordPress ignores all but the first one, thinking it's already loaded and it wouldn't be wise to load it twice.

Give them some meaningful names and you'll be able to use requirements (third parameter), e.g. tell wordpress that this script you're loading requires jQuery and OtherScriptOne. If those are registered (see Muhammed Hafil's answer), they will be loaded automatically and inserted before the script you're adding.

0
votes

you need to register script and style before using them and you should use different handle for each script and styles .correct format is

    function enqueue_our_required_stylesheets(){
        wp_register_style('font-awesome', get_template_directory_uri() . '/assets/css/font-awesome.min.css');
        wp_enqueue_style('font-awesome');
        wp_register_script('script', get_template_directory_uri(). '/assets/js/all-script.js');
        wp_enqueue_script('script' );

    }

Note : you don't need to register jquery since it is registered by wordpress itself, you can just enqueue them directly without registering. you can go through the wp registered scripts in their codex at https://developer.wordpress.org/reference/functions/wp_register_script/#core-registered-scripts