A Tech-Blog

If your WordPress plugin or theme uses JavaScript, it is essential to know how to include it so that you don’t break other JavaScript libraries or plugins/themes that use JavaScript.

The straight forward way to load JavaScript is of course to embed a script tag with the JS file as a src attribute:

<script src="my-plugin/js/jquery.js"></script>

Of course you can load your own custom JavaScript that way, but don’t do that if you are loading a JavaScript library! Check the list of JavaScript libraries supplied by WordPress. Do not include a library with your theme/plugin if WordPress already brings it along!!!

WordPress offers a nice and easy way to load JavaScript libraries, the wp_enqueue_script() function. If you are including a JavaScript file that depends on e.g. jQuery, you can just tell WordPress and it will load jQuery for you!

Example from my jQuery Colorbox plugin:

wp_enqueue_script('colorbox', plugins_url('js/jquery.colorbox-min.js', __FILE__), array('jquery'), '1.3.6');

I tell WordPress to load the Colorbox JavaScript library that depends on jQuery. WordPress makes sure that the jQuery library is loaded before my JavaScript is loaded so everything will work as expected.

(links)
wp_enqueue_script description @ WordPress
JavaScript libraries supplied by WordPress