Support » Themes and Templates » Loading jQuery UI in head

  • Resolved Swellfire

    (@swellfire)


    I am trying to load jquery-ui-core and jquery-ui-tabs in the head of my theme. Here is my code:

    add_action( 'wp_enqueue_scripts', 'load_jquery_ui' );
    function load_jquery_ui() {
    	wp_enqueue_script( 'jquery-ui-core' );
    	wp_enqueue_script( 'jquery-ui-tabs' );
    
    }

    Default for wp_enqueue_script is to load the script in the head. I have tried adding it to the jquery array to no avail.

Viewing 2 replies - 1 through 2 (of 2 total)
  • Swellfire

    (@swellfire)

    I found a solution here

    Evidently you have to deregister the script and then enqueue it again like so:

    add_action('wp_enqueue_scripts', 'swellfire_load_scripts');
    function swellfire_load_scripts(){
        if( is_admin() ) return;
        wp_deregister_script( 'jquery-ui-core' );
        wp_enqueue_script( 'jquery-ui-core', site_url(  '/wp-includes/js/jquery/ui/jquery.ui.core.min.js' ), array('jquery') );
        wp_deregister_script( 'jquery-ui-tabs' );
        wp_enqueue_script( 'jquery-ui-tabs', site_url(  '/wp-includes/js/jquery/ui/jquery.ui.tabs.min.js' ), array('jquery') );
    }

    If anyone knows a more elegant way to solve this I would love to see it.

    Swellfire

    (@swellfire)

    Correction, you need to load widget as well.

    add_action('wp_enqueue_scripts', 'swellfire_load_scripts');
    function swellfire_load_scripts(){
        if( is_admin() ) return;
        wp_deregister_script( 'jquery-ui-core' );
        wp_enqueue_script( 'jquery-ui-core', site_url(  '/wp-includes/js/jquery/ui/jquery.ui.core.min.js' ), array('jquery') );
        wp_deregister_script( 'jquery-ui-widget' );
        wp_enqueue_script( 'jquery-ui-widget', site_url(  '/wp-includes/js/jquery/ui/jquery.ui.widget.min.js' ), array('jquery') );
        wp_deregister_script( 'jquery-ui-tabs' );
        wp_enqueue_script( 'jquery-ui-tabs', site_url(  '/wp-includes/js/jquery/ui/jquery.ui.tabs.min.js' ), array('jquery') );
    }
Viewing 2 replies - 1 through 2 (of 2 total)
  • The topic ‘Loading jQuery UI in head’ is closed to new replies.