29

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' ); ...


9

Given that all of the libraries you need for the datepicker are bundled with WordPress and are registered with all of the appropriate dependencies, all you really need to do is: function enqueue_my_scripts_wpse_97533() { wp_enqueue_script('jquery-ui-datepicker'); } add_action('wp_enqueue_scripts','enqueue_my_scripts_wpse_97533'); If you then look at the ...


7

If you take a look at registrations in source there is no alias to load all of jQuery UI in bulk available and WP core itself uses pieces as dependencies individually. You could create and use such alias yourself (registered script handle with no URL and all of needed scripts as dependencies), but it might be overkill - there are a lot of scripts there to ...


7

Please note that none of the above examples are reliable in case you use a page cacheing plugin, then the code in body tag will be static. Also there is a simple way to do this (with no extra query to ajax which is not optimal) If you want to test user logged in state with javascript, you can use this code to set cookie when user logged in and delete cookie ...


6

To complement @s_ha_dum’s excellent answer, here is an example showing how to use the built-in jQuery UI date picker on your plugin page. The result will look like this: The most important parts: Use your option page slug to enqueue the scripts and stylesheets on your page only, not on all admin pages (background). Make sure to set datepicker({ dateFormat: ...


6

Simple tutorial - How to sort customizer sections in the panel and add order to theme. 1. You must use prefixes to do this because customizer don't support custom classes. ctmss_panel_ - for panels ctmss_section_ - for sections ctmss_hidden_ - for hidden sections that has a input with values 2. Add panel to the Customizer - add_panel() $wp_customize->...


4

Add the following code in functions.php file of your theme that will remove default jquery ui core and will add your provided latest jquery ui core file from your theme. function my_scripts_method() { if(!is_admin()){ wp_deregister_script( 'jquery-ui-core' ); wp_enqueue_script('jquery-ui-core', get_stylesheet_directory_uri().'/jquery.ui.core....


4

Just take a look at the Codex for all the default scripts and their slugs. The jQuery UI stuff is: Name Handle Dependencies jQuery UI Core jquery-ui-core jquery jQuery UI Widget jquery-ui-widget jquery jQuery UI Mouse jquery-ui-mouse ...


4

To load script & style, add the following code to your theme's functions.php file. function add_e2_date_picker(){ //jQuery UI date picker file wp_enqueue_script('jquery-ui-datepicker'); //jQuery UI theme css file wp_enqueue_style('e2b-admin-ui-css','http://ajax.googleapis.com/ajax/libs/jqueryui/1.9.0/themes/base/jquery-ui.css',false,"1.9.0",false); } ...


4

jQuery UI Tabs are actually shipped with WordPress core, so implementing them is quite easy. It sounds like you're only trying to utilize the tabs on the admin side, so a very basic setup would look something like: In functions.php: function my_enqueue_scripts($hook) { // Only load the scripts on the pages where they're needed if( 'myfile.php' != ...


3

For those who debug "not working" datepicker - for me it was an issue of my reset css, specifically of this: html, body { overflow: auto; } My datepicker was alright, but kept appearing on far top of the screen. :)


3

You should do these: add_action( 'admin_enqueue_scripts', 'admin_scripts' ); function admin_scripts(){ wp_enqueue_script( 'jquery-ui-dialog' ); wp_enqueue_style( 'wp-jquery-ui-dialog' ); } then you should use: jQuery('<div> Hii! <div>').dialog({ modal:true, width:600 });


3

You can call scripts in your function to only load for the front or home page. The codex is not a very complete reference, to include the jQuery UI Effects core you can do the following: wp_enqueue_script( 'jquery-effects-core'); Or you can iclude just the effects you want , such as: wp_enqueue_script( 'jquery-effects-blind'); Here is a reference to ...


3

Just found it here http://codex.wordpress.org/Function_Reference/wp_register_script Here is an example how to load it on a plugin: function load_jquey_spinner() { wp_enqueue_script( 'jquery-ui-spinner' ); } add_action('wp_enqueue_scripts', 'load_jquey_spinner');


3

Your issue is that you are trying to use the normal jQuery shortcut ($) which doesn't work by default as the WordPress version of jQuery is in compatibility mode. You need to wrap the code in your custom.js file in an anonymous function to map jQuery to $ as shown below: (function($) { //Your code here })( jQuery ); or alternatively, replace all ...


3

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='...


2

There are several ways to include jQuery into a theme. I always use WP bundled version which I find very simple. To properly set things up, we need to make sure WP page will have following files to be included in page load. For loading bellows script & style add bellows code on theme functions.php file. Script for front-end use function ...


2

Ok, so, for some reason I can't comprehend, the answer is that the div element containing the tabs should have a class and not an id for jQuery UI to work properly, as such: <div class="mytabs"> and jQuery(document).ready(function($) { $(".mytabs").tabs(); }); Just for the record, the way I enqued the scripts is: add_action( '...


2

jQuery-UI is included in every default WP installation. Whether it is loaded depends on your theme and/or plugin(s). Three Options: live with it disable plugins one by one (and switch theme), figure out which is responsible and whether that's needed manually deregister it (something, i.e. a plugin, will probably break)


2

You can filter out all jQuery UI scripts from the global $wp_scripts: function wpse124959_wp_scripts_filter() { global $wp_scripts; foreach ($wp_scripts->registered as $reg) { if ( preg_match('/^jquery-ui/', $reg->handle ) ) $script_hs[ $reg->handle ] = $reg->src; } print_r( $script_hs ); }...


2

You can review the explanation here to include any script here function my_enqueue($hook) { if( 'edit.php' != $hook ) return; wp_enqueue_script( 'my_custom_script', plugins_url('/myscript.js', __FILE__) ); } add_action( 'admin_enqueue_scripts', 'my_enqueue' ); The above code will add the script in all your admin pages. In order to identify ...


2

Are you sure it is not loading? I tried this(using WordPress 3.6-beta1): function add_scripts(){ wp_enqueue_script( 'jquery-ui-autocomplete' ); } add_action('wp_enqueue_scripts', 'add_scripts'); I got jQuery and jQuery migrate in the header: <script type='text/javascript' src='http://localhost/wordpress/wp-includes/js/jquery/jquery.js?ver=1.9.1'>&...


2

Enqueue your script instead of putting it in your template, you can enqueue your code as is, or put your code in an actual file. The benefit of doing this is you gain control over output, as you can see there is a $priority parameter for add_action. add_action( $hook, $function_to_add, $priority, $accepted_args ); Futhermore wp_enqueue_script comes with ...


2

There are a couple of ways to achieve this. I think the following methods are the best to use. Method 1 Simply just add the script code directly to your functions file, and hook that function to wp_enqueue_scripts function enqueue_my_script() { ?> <script> (function($){ $("#to").autocomplete({ var availableTags = [ "...


2

Bad news first: We can't fix your JS problem (at least as long as the errors come from the jQuery UI version shipped with core and not from your custom definitions). This is a WordPress core problem. When you look at the SVN trunk, especially the main (and only) PHP file in that folder, you will see that the plugin doesn't even ship with any script... at ...


2

Here's how I do it for my plugin/options page (which is inside a class, thus the $this-> construct): /* enqueue our css */ public function enqueue_options_style( $hook ) { if( $hook == $this->admin_page ) wp_enqueue_style( 'my-options', '/some-directory/my-options.css', false, $this->version ); // only present for our plugin's settings ...


2

Your JS looks to be written inline vs. in its own JS file or at least enqueued on its own. In other words, it doesn't look like its being loaded properly re WordPress. Note the WP function wp_enqueue_script() has a dependency parameter where you can pass an array of script handles (as registered via wp_register_script()). The parameters of this function ...


1

In many cases, in backend you may use: jQuery('#something') instead of $('#something')


1

You should enqueue just the scripts you need, and it will add in the script dependencies. You don't need to worry about picking which ones to enqueue. For example, if you want to include the scripts required for the Accordion widget, just add the following snippet and it will load all the dependencies too (jQuery, jQuery-UI core, jQuery widget). ...


1

Just include the pieces you actually need. It will handle the dependencies for you. For example, if you needed jquery-ui-dialog, then you can just enqueue that one and it will then go and automatically add jquery-ui-resizable, jquery-ui-draggable, jquery-ui-button, jquery-ui-position, jquery-ui-core, jquery-ui-mouse, jquery-ui-widget, and jquery all by ...


Only top voted, non community-wiki answers of a minimum length are eligible