How to Use JQuery with a Child Theme in WordPress.
Yet another instalment in our free Tips and Tricks library.
- Validating form variables locally before posting to the server or adding to database.
- Performing calculations.
- Using JQuery to control CSS to customise page layout.
This example show you how to:
- Download the JQuery Library
- Use JQuery with a Child Theme.
- Enqueue Scripts.
- Create a JQuery function and use it.
The best case scenario is to always load the JQuery Library from a Content Delivery Network – for maintenance, speed, caching and a host of other reasons.
But this tutorial just concentrates on the basic functionality and works with a site-specific install of the JQuery Library.
What is JQuery?
The explanation on the official JQuery site is as follows:
Step 1 :
Download the JQuery Library from the website. Download the compressed, production version (2.2.2 at time of writing this post)
Save the downloaded file into your js folder.
Save this file as script.js in the js folder. (again, the name of this file is not relevant – just so long as you know what it’s name is and where it is).
In order to use JQuery with a Child Theme, you need to enqueue the script. You could also register it first, but as stated earlier, I’m sticking to the simplest implementation here.
One thing you definitely shouldn’t do is to try and add the JQuery script link in the head tag of your page. It can break your site because plugins or themes that use JQuery can be forced to load twice. So to be clear, do this: