How to include JQuery on your WordPress theme

28 Responses

Ronny

Jul 17 2009 14:38

First!

Amazing, all this time I’ve loaded it externally from Google, or self-hosted it. Thanks!

ORiOn

Jul 17 2009 15:08

That doesn’t work in here, I have WordPress 2.8.1.

Darran

Jul 17 2009 18:51

One thing worth taking note of is the conflict with prototype which may cause it to not work in IE at least. Be sure to call the noConflict() method.

$j = jQuery.noConflict();

And you can call any jQuery functions like such:

$j(this).fadeTo("normal", 0.5);

Kristof

Jul 17 2009 19:43

If you call jQuery from Google (see below) you can be assured you’re always using the most up-to-date version. Otherwise, the version included inside WP may be dated. (Purposely removed start/end code to post)

script type=”text/javascript” src=”http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.js”>

If you don’t care so much about being *exactly* current, the above code is great!

rismaka

Jul 18 2009 03:55

Thanks. I didn’t know about this. I used to call jQuery from lib, or download them to my server and enqueue it internaly. Top banget deh

Nick Ohrn

Jul 19 2009 03:17

Please be aware that you need to put the wp_enqueue_script function call above the wp_head function call for this method to work.

Sunil

Jul 19 2009 07:22

I already wrote a blog about this. In that I demonstrate how to integrate a thickbox in WordPress. Have a look http://www.myhtmlworld.com/wordpress/create-thickbox-wordpress.html

Jake

Jul 20 2009 16:40

It didn’t work for me either. Already placed it inside tag and above wp_head function. Maybe it’s a version issue. I’m also using 2.8.1 (wpmu).
I’ll try it on single user later.

Anywayz, I really learned a lot from your recipes. Nice job!

Jul 20 2009 22:45

It’s a smarter choice to have your JQuery hosted at Google, speeds up your website.

WPGPL Team

Jul 22 2009 05:54

Why this code doesn’t work on me too?
I was follow Nick Ohrn tips by adding this code above wp_head()

but the code didn’t show up

Any suggestion?

apis

Jul 24 2009 09:10

jQuery(document).ready(function($) {
// $() will work as an alias for jQuery() inside of this function
});

Ray

Jul 25 2009 02:37

Just an FYI… for those that link directly to Google, WordPress’ version of jQuery is different.

At the bottom of it, WP adds the following line:
jQuery.noConflict();

Scott Elkin

Jul 30 2009 20:49

Just tried in WordPress 2.8.2 and it doesn’t work. Will stick to pointing to google.

Daniel Sachs

Aug 02 2009 09:37

It’s a great tip for theme AND plugin development. In general it’s much more clean and elegant to call scripts by queueing them. One of the most important benefits is cross script compatibility. And while we are at wp_enqueue could you please also write about wp_localize_script – wp_enqueue’s “brother in law”?

Alex Weber

Aug 22 2009 08:51

I’ve tried everything and then some and still no luck with manually pointing to Google’s CDN. I deregistered jquery and manually inserted the script tags in my template’s header and it loads but nothing works. I also created a script tags immediately after with jQuery.noConflict() but that seemed to make no difference… oh man! Any suggestions?