Wordpress - Correct Way To Enqueue Jquery-ui


Answer :

First of all, WordPress registers jQuery UI via wp_default_scripts(). Dependencies are already set, so you only need to enqueue the script you really need (and not the core). Since you're not changing version number or anything, it is ok to only use the handle.


// no need to enqueue -core, because dependancies are set
wp_enqueue_script( 'jquery-ui-widget' );
wp_enqueue_script( 'jquery-ui-mouse' );
wp_enqueue_script( 'jquery-ui-accordion' );
wp_enqueue_script( 'jquery-ui-autocomplete' );
wp_enqueue_script( 'jquery-ui-slider' );

As for the stylesheets: WordPress does not register jQuery UI styles by default!


In the comments, butlerblog pointed out that according to the Plugin Guidelines



Executing outside code within a plugin when not acting as a service is not allowed, for example:



  • Calling third party CDNs for reasons other than font inclusions; all non-service related JavaScript and CSS must be included locally



This means loading the styles via CDN is not permitted and should always be done locally. You can do so by using wp_enqueue_style().



If you are enqueuing your own script, you can just add 'jquery-ui-accordion', for example, to the list of dependencies. All the required dependencies will be added automatically. Example:



wp_enqueue_script( 'my-theme', get_stylesheet_directory_uri() . '/js/theme.js', array( 'jquery', 'jquery-ui-accordion' ) );


Will generate this code:



<script type='text/javascript' src='/wp-includes/js/jquery/ui/core.min.js'></script>
<script type='text/javascript' src='/wp-includes/js/jquery/ui/widget.min.js'></script>
<script type='text/javascript' src='/wp-includes/js/jquery/ui/accordion.min.js'></script>
<script type='text/javascript' src='/wp-content/themes/theme/js/theme.js'></script>


Comments

Popular posts from this blog

Converting A String To Int In Groovy

"Cannot Create Cache Directory /home//.composer/cache/repo/https---packagist.org/, Or Directory Is Not Writable. Proceeding Without Cache"

Android SDK Location Should Not Contain Whitespace, As This Cause Problems With NDK Tools