How To Include jQuery in WordPress (The Proper Way)

You may or may not know it, but at the moment, I still have time to do most of the work that my company requires by myself. This includes all the coding and theme development. I’m not going to say that it has always been easy. I have definitely been through hard times figuring how certain things work.

My background doesn’t include any technical skills with computer. As you can see in my small biography, I did not study any kind of computer language, but I am very very curious! This is probably one of my strongest skills.

Anyway, I’m losing focus there! So, while developing the theme for Dukeo, I have been facing a small issue. You can see on the frontpage that I integrated a carousel which is presenting my most popular posts. Well, this animation is made through the use of a javascript library: jQuery. This is basically a kind of toolbox with functions that you can call to perform basic stuff.

To make it work, I had to load jQuery in the header of my blog. As for most things in life, there is a fast way, and there is a right way of doing that. When I do things, I like doing them well, so I searched for the right way, and here it is: you need to copy this code:

1

<?php wp_enqueue_script("jquery"); ?>

just before this line in your blog header.php file:

1

<?php wp_head(); ?>

Now you are all set to call your own jQuery JavaScript file, AFTER the wp_head function. It should look like this:

1

<script type="text/javascript" src="<?php bloginfo("template_url"); ?>/js/yourScript.js"></script>

Of course, you need to update this line to fit the path to your JavaScript file.

Now tell me what kind of animation do you want to add to your website in the future? (I might make a tutorial for you if needed).