WordPress jQuery Loaded in noConflict Mode

Loading JavaScripts in WordPress queues up the internal, minified versions of scripts like jQuery that come with WordPress. jQuery is loaded in noConflict mode so javascript code won’t work if it uses the “$” shortcut like so:

$(document).ready(function(){
  $(.slideshow1).cycle();
});

A simple solution is to pass the dollar sign in the anonymous function of a ready() call and that way the code that you’ve already written with the $ shortcut will work ok. The dollar sign acts as an alias for jquery.

jQuery(document).ready(function($){
.
.
//javascript code in here can use the $() shortcut instead of jQuery()
.
.
});

Alternatively, instead of waiting for the entire document to be rendered as with the ready() method above, the javascript can be put in the following jQuery wrapper so that the code can be used right away.

(function($) {
  	$('#newsticker').innerfade({
	  animationtype: 'slide',
	  speed: 750,
	  timeout: 2000,
	  containerheight: '30px'
	});
})(jQuery);

Using one of these jQuery wrappers is recommended to avoid conflicts with other scripts that may rely on the dollar sign shortcut on your WordPress sites.

Leave a Reply

Your email address will not be published. Required fields are marked *