/    Sign up×
Articles /Pin to ProfileBookmark

How To Conditionally Enqueue Scripts In WordPress

There are situations that may arise where you want to load a JavaScript file only on a certain page or pages instead of loading it on every page of the website, primarily because you only want it to run on that page and don’t need it to load on pages where it is not running. Most WordPress themes enqueue (load) their necessary scripts on all pages already, but what if you want to conditionally enqueue scripts or a script instead? This quick tutorial will show you how to do that – to check if you are on a certain page or pages and, if so, load the corresponding script file.

WordPress has an abundance of conditional tags built in. Utilizing these to match the conditions you’re looking for, you can wrap the enqueuing of your script so that it only loads when the condition is met. For instance, if you only wanted the script to run on a page with the slug of ‘mypage’, you would use the conditional tag if(is_page('mypage')) { load that script! } to conditionally enqueue your script only on that page.

Of course, there are a multitude of other conditional tags you can use, found at the link above. Some more common uses may be:

  • is_single()  – When a single post of any post type (except attachment and page post types) is being displayed, narrowed down by using the post ID, title, slug, or an array of a combination of any of the three.
  • is_front_page() – When the main blog page is being displayed and the ‘Settings > Reading ->Front page displays’ is set to “Your latest posts”, or when ‘Settings > Reading ->Front page displays’ is set to “A static page” and the “Front Page” value is the current Page being displayed. (Confusing? Click here for more explanation.)
  • is_home() – This one gets a bit more tricky, but when used correctly it will display your blog posts page. (See here.)
  • is_category() – When the archive page of a specific category or group of categories is being displayed, narrowed down by using the category ID, name, slug, or an array of a combination of any of the three, plus a few more conditions can be designated.

So let’s move on to how to use these tags to conditionally enqueue scripts in WordPress. Simply open your theme’s functions.php file and add the following code at the bottom.

add_action('wp_enqueue_scripts', 'firstwd_enqueue');
function firstwd_enqueue() {
    if (is_page('mypage')) {
        wp_enqueue_script('script-name', get_template_directory_uri().'/path-to-script-name.js', array( 'jquery' ), '', true);

You will need to make sure to change ‘mypage’ to the slug of your page, ‘script-name’ to whatever you want to use as a unique name of the script, and ‘/path-to-name-of-script’ to match the url to the script within your theme’s directory (often something like ‘/assets/js/name-of-script.js’).

Again, refer to the WordPress Codex for all of the variations of tags that you can use to conditionally enqueue scripts in WordPress.



Help @1WD spread the word by sharing this article on Twitter...

Tweet This
Sign in
Forgot password?
Sign in with TwitchSign in with GithubCreate Account
about: ({
version: 0.1.9 BETA 9.26,
whats_new: community page,
up_next: more Davinci•003 tasks,
coming_soon: events calendar,
social: @webDeveloperHQ

legal: ({
terms: of use,
privacy: policy
changelog: (
version: 0.1.9,
notes: added community page

version: 0.1.8,
notes: added Davinci•003

version: 0.1.7,
notes: upvote answers to bounties

version: 0.1.6,
notes: article editor refresh
recent_tips: (
tipper: @ddiebold17,
tipped: article
amount: 1000 SATS,

tipper: @Mqlinka19,
tipped: live stream
amount: 4900 SATS,

tipper: @Mqlinka19,
tipped: article
amount: 10 SATS,