Invoking Jquery in a Plugin

Question

I am using the following code in my plugin :

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>

<?php echo "<script src=".$plugins_url."/mistral/js/jquery.pajinate.js>  </script>";  ?>
<script>
$(document).ready(function(){
$('#paging_container1').pajinate();
});
</script>

Now it is breaking my other jquery plugins due to the re instantiating of the Jquery from the CDN . Any solution to use the default jquery with WordPress would be great.

Answer 1

To load default wordpess jquery you can use this

add_action( 'wp_enqueue_scripts', 'my_jquery' );

function my_jquery(){
  wp_enqueue_script("jquery");
}

And use jquery no conflict wrapper to avoid error or on your jquery code

(function($) {
    // Inside of this function, $() will work as an alias for jQuery()
    // and other libraries also using $ will not be accessible under this shortcut
})(jQuery);

Get more details on wp enqueue script

Answer 2

Use proper enqueue-ing and stop using the $ shortcut and you should have no issues.

add_action('wp_enqueue_scripts', 'example');
function example() {
    wp_enqueue_script( 'pajinate', plugins_url("js/jquery.pajinate.js", __FILE__), array('jquery') );
}

add_action('wp_head','example_two');
function example_two() {
?>
<script type="text/javascript">
jQuery(document).ready(function(){
   jQuery('#paging_container1').pajinate();
});
</script>
<?php
}

Answer 3

Wordpress has excellent tools to handle scripts dependencies and you should use it. You can start with:

• wp_enqueue_scripts
• wp_register_script
• wp_enqueue_script

In general, it is not recomended to load an external jQuery, but if you really want to do it, you have to deregister the jQuery copy from WP core and then register your own copy or from CDN:

add_action('wp_enqueue_scripts', 'wpse_scripts');
function wpse_scripts() {

    //Uncomment the next two lines if you want to load jquery from Google CDN
    //wp_deregister_script('jquery');
    //wp_register_script( 'jquery', '//ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js', false );

    //Pajinate depends on jquery
    wp_register_script( 'pajinate', $plugins_url."/mistral/js/jquery.pajinate.js", array('jquery') );

    //In the next file include your functions and code that depends on jquery and pajinate
    wp_register_script( 'my-script', $plugins_url."/mistral/js/your-script.js", array('jquery', 'pajinate') );

    //Now you are ready to load enqeue the registered scripts
    wp_enqueue_script('jquery');
    wp_enqueue_script('pajinate');
    wp_enqueue_script('my-script');

}