This post covers four major topics:
- Available Libraries
- Using CDNs
- Localize Script
You wouldn’t want to just add a script tag into a template or header file. You also don’t want to just echo out a script that’s being called in. These methods don’t follow the best practices and if you do you’ll potentially create conflict issues with other scripts being called.
Instead, you want to rely on a few functions that are provided for adding and removing scripts the WordPress way. These are:
- wp_register_script() – get ready to use a script (but don’t load it up yet)
- wp_deregister_script() – remove a registered script
- wp_enqueue_script() – load that script into my theme/plugin so I can use it now
- wp_dequeue_script() – remove an enqueued script
Typically this is going to happen in functions.php or in a custom plugin but may occur in other places as well.
- Stage a script by calling the wp_register_script function.
- Load the script from #2 using the wp_enqueue_script function.
There are some arguments for the wp_register_script() function:
- $handle – gives the script a unique nickname (required string).
- $src – where is the file (string).
- $deps – what other scripts have to be loaded first. (array).
- $ver – the script’s version number (string).
- $in_footer – should WordPress try and load this in the footer? This can be a boost to the load time for the page and so is often encouraged (boolean).
Note that there are a couple of similar actions (admin_enqueue_scripts and login_enqueue_scripts) that are used for the admin area and login screen respectively. They behave the same as the wp_enqueue action but affect their respective locations. It’s important to note that wp_enqueue_scripts fires on all requests.
There are a few handy implementation practices that can help you leverage scripts in a smarter way. The register and enqueue functions don’t need to happen in the same action they can be separated so you’re only enqueuing when you need to. Also, if you have a page or page type where the scripts don’t need to be enqueued you can use conditional statements to limit loading unless necessary. Finally, you can choose to skip the register function if you prefer, but it may be useful to keep it in place.
On a related note, you can use similar functions to register and enqueue stylesheets for your site:
When you’re faced with a high traffic site pulling in scripts from an external source can make a lot of sense. Offloading these calls can reduce your traffic (and hosting costs). This can also be a factor to help you optimize your site for better search results.
Setting this up can require you to deregister some scripts (if they’re among the scripts that are already available in WordPress) and enqueue the same script from the external source. Then you can call the external scripts with your register and enqueue functions. Use caution when doing this because it will be up to you to ensure that you’re using the appropriate library versions and that your customization doesn’t accidentally break anything in WordPress.