2

I want to use jQuery in a plugin. In functions.php of the theme I'm using, I found:

if(!is_admin()) {
        wp_deregister_script('jquery');
        wp_register_script('jquery', 'http://ajax.googleapis.com/ajax/libs/jquery/1.5.0/jquery.min.js');

As I understand it, this loads jQuery and I'm ready to go. All I have to do is add this to my plugin's javascript file:

jQuery(document).ready(function($) {

    //put jquery code here

})

A) Is that it? Am I missing anything?

I did not see this in the header.php:

<?php wp_enqueue_script('jquery');?>
<?php wp_head(); ?>

B) I'd also like to use jquery-ui. In a plugin that came with the theme, I found:

wp_enqueue_script("jquery-ui-sortable");
wp_enqueue_script("jquery-ui-draggable");
wp_enqueue_script("jquery-ui-droppable"); 

Do I simply do the same as above in own plugin? And then call it in my js file as:

jQuery(document).ready(function($){

}

What if I want to use other bits of the jQuery-UI library? How can I tell which parts of jQuery-UI are included in the theme?

Sorry for the basic questions. I want to make sure that I'm set-up properly and I understand what's going on.


Additional Info:

Let's say I've got a plugin called "myplugin". The plugin works. But, I want to add some jQuery functionality. In myplugin's main function I add:

wp_enqueue_script('myplugin_script', 'http://mysite/wp-content/plugins/myplugin/js/myplugin_script.js');

In myplugin_script.js, I have:

jQuery.noConflict();

jQuery(document).ready(function($) {                
    alert("Hello");                                                                     
})

Why isn't the alert popping up? Do I need to add the script to a hook? Or will wp_enqueue_script cause it to fire?

Thank you.

-Laxmidi

1 Answer 1

5

First of all, if your code (or the theme's code) is unregistering jQuery and re-registering it from another location (Google), you need to add this somewhere:

jQuery.noConflict();

This makes jQuery cooperate with other scripts (i.e. Prototype) that try to define the $ variable globally. WordPress has this line bundled into their version, Google does not.

If you need to enqueue jQuery and a bunch of jQuery UI stuff, you'll need to do that.

function my_enqueue() {
    wp_enqueue_script('jquery');
    wp_enqueue_script("jquery-ui-sortable");
    wp_enqueue_script("jquery-ui-draggable");
    wp_enqueue_script("jquery-ui-droppable"); 
}
add_action( 'wp_enqueue_scripts', 'my_enqueue' );

This will hook your enqueues to the appropriate action that will output them in the header. I'm assuming that the jQuery UI scripts are already registered within WordPress.

3
  • is not jQuery(document).ready(function($) {}) already no-conflict mode?
    – Mamaduka
    Commented Sep 2, 2011 at 16:44
  • That itself is written as to not conflict with other scripts, but you still have to call jQuery.noConflict() to release jQuery's hold on the global $ variable. See the official jQuery docs for details ...
    – EAMann
    Commented Sep 2, 2011 at 16:54
  • 1
    Hi EAMann, Thank you very much for your detailed message. Sorry, I'm still struggling a bit. I'll add some more info to my question in a sec.
    – Laxmidi
    Commented Sep 2, 2011 at 21:05

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.