Adding async attribute

Question

I'm creating a website using WordPress. So to defer parsing of JavaScript I think I need to add an async attribute. Here I'm calling my scripts using this method.

wp_enqueue_script( 'jquery', 'https://code.jquery.com/jquery-3.3.1.min.js', array( 'jquery' ), false, true );
wp_enqueue_script( 'bootstrap-js',get_stylesheet_directory_uri() . '/scripts/bootstrap.min.js', array( 'jquery' ), false, true );
wp_enqueue_script('magnific-popup-js', get_stylesheet_directory_uri() . '/scripts/jquery.magnific-popup.min.js', array('jquery'), false, true);
wp_enqueue_script('wow', get_stylesheet_directory_uri() . '/scripts/wow.min.js', array('jquery'), false, true);
wp_enqueue_script( 'parallax', get_stylesheet_directory_uri() . '/scripts/jquery.enllax.min.js', array( 'jquery' ), false, true );
wp_enqueue_script( 'classie', get_stylesheet_directory_uri() . '/scripts/classie.js', array( 'jquery' ), false, true );
wp_enqueue_script( 'service', get_stylesheet_directory_uri() . '/scripts/service.js', array( 'jquery' ), false, true );
wp_enqueue_script( 'semnox', get_stylesheet_directory_uri() . '/scripts/semnox.js', array( 'jquery' ), false, true );
wp_enqueue_script( 'careers-details', get_stylesheet_directory_uri() . '/scripts/careers-details.js', false, true );
wp_enqueue_script( 'event', get_stylesheet_directory_uri() . '/scripts/jquery.event.move.js', array( 'jquery' ), false, true );
wp_enqueue_script( 'twenty', get_stylesheet_directory_uri() . '/scripts/jquery.twentytwenty.js', array( 'jquery' ), false, true );
wp_enqueue_script( 'global', get_stylesheet_directory_uri() . '/scripts/script.js', array( 'jquery' ), false, true );
wp_enqueue_script( 'infosys', get_stylesheet_directory_uri() . '/scripts/infosys.js', array( 'jquery' ), false, true ); 
wp_enqueue_script( 'careers', get_stylesheet_directory_uri() . '/scripts/careers.js', array( 'jquery' ), false, true ); 
wp_enqueue_script( 'video', get_stylesheet_directory_uri() . '/scripts/video.js', array( 'jquery' ), false, true );
wp_enqueue_script( 'monest', get_stylesheet_directory_uri() . '/scripts/monest.js', array( 'jquery' ), false, true );
wp_enqueue_script( 'prajavani', get_stylesheet_directory_uri() . '/scripts/prajavani.js', array( 'jquery' ), false, true );
wp_enqueue_script( 'wow', get_stylesheet_directory_uri() . '/scripts/wow.min.js', array( 'jquery' ), false, true );
wp_enqueue_script('owl-carousel', get_stylesheet_directory_uri() . '/scripts/owl.carousel.min.js', array('jquery'), false, true);
wp_enqueue_script( 'script2', get_stylesheet_directory_uri() . '/scripts/script2.js', array( 'jquery' ), false, true );

Check this thread. https://stackoverflow.com/questions/18944027/how-do-i-defer-or-async-this-wordpress-javascript-snippet-to-load-lastly-for-fas — zipkundan, Jan 22 '19 at 07:02

Vel · Answer 1 · 2019-01-22T10:34:32.083

1

Try this code. Add this code in functions.php file

add_filter( 'script_loader_tag', 'async_filter', 10, 2 );

function async_filter( $tag, $handle ) {
    if($handle =="global"){
    return str_replace( ' src', ' async src', $tag );           
    }else{
    return $tag;
    }
}

edited Jan 22 '19 at 10:34

answered Jan 22 '19 at 07:06

Vel

9,027
6
34
66

Comments are not for extended discussion; this conversation has been [moved to chat](https://chat.stackoverflow.com/rooms/187151/discussion-on-answer-by-vel-adding-async-attribute). – Samuel Liew Jan 23 '19 at 01:20

Adding async attribute

1 Answers1