Moving jQuery and other script code to the bottom of html code in Worpdress

Why script (eg. JavaScript) needs to be put at the bottom of html code is nicely described in article High Performance Web Sites: Rule 6 – Move Scripts to the Bottom. So now I will not explain here why.

Let’s focus on how to move any scripts in WordPress to the bottom of html code. Let’s say we want to move mycode.js file (which is located in /js/ directory in our theme directory) with our code that depend on jQuery in our WordPress theme. Open header.php and insert the code just before any html code:

and also in footer.php just before body ends put:

Now your request for mycode.js code will be inserted at the end of html code.

For jQuery you can do:

Note: put jQuery before any code that depend on jQuery code.

Look also at wp_enqueue_script method description in WordPress documentation.