Registering and referencing jQuery scripts the right way in WordPress

[jonedwards]

Hey Chris and Co.

I’m a user / member of Digging into WordPress (i.e. got the ebook), and while I’ve learnt and kinda understand how one should register jQuery using functions.php, what I’m not sure of, is how to use other scripts?

• Do I simply register jQuery in functions.php, and then reference all my related scripts in the head of my header.php file?
• Or, do I need to reference my other files from functions.php as well?

The load order of the scripts is important, as is making sure you load CSS first, then javascript.

I guess I’m really looking for a practical example of the functions.php bit and the header.php bit?

Any help would do though…

Thanks in advance.
Jon

[TheDoc]

This is what I’ve most recently used in my functions.php:

if( !is_admin()){

wp_deregister_script('jquery');

wp_register_script('jquery', ("http://code.jquery.com/jquery-1.6.2.min.js"), false, '1.6.2');

wp_enqueue_script('jquery');

}

It sort of resets everything. The !is_admin is important because you don’t want to be messing around with the backend.

Then, in your header.php, you’ll want to put:

…just before the closing head tag.

[jonedwards]

Hey Doc.

Thanks for your feedback – appreciate it. I do however, have most of that down already – from going through all the DigWP tutorials.

How though, do I reference my own js (jquery) files for my theme? Do I enqueue them in the same way as we did the Google-hosted jQuery – i.e. in functions.php? OR, do I place them in the of my header.php file?

As I mention above, the load order of these things is important, so I’m looking for a solution that gets things loaded, not only the right place, but in the right order (CSS first, then Google-hosted jQuery, then my theme scripts).

Thanks

Jon

[TheDoc]

Ah yes, I see what you mean! I would simply place them after the wp_head call, but I’m not particularly sure if that’s best practice or not. I’m assuming that they are just jQuery functions?

[jonedwards]

Hey Doc.

Yup. They’re jQuery functions and jquery plugins all sitting in a /js/ folder in my theme.

I found this article – http://markwilkinson.me/2011/02/loading-wordpress-scriptsstyles-correctly/ – I think it might answer some things…

[Author]

Posts