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.

UNLIMITED DOWNLOADS: 500,000+ WordPress & Design Assets

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.

WordPress has an abundance of conditional tags built in (see details here). 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.
Sign up for Envato Elements and get unlimited downloads starting at only .50 per month!

DOWNLOAD NOW

  • 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.

Again, refer to the WordPress Codex for all of the variations of tags that you can use to conditionally enqueue scripts in WordPress. be sure to check out our other WordPress tutorials for more quick snippets like this along with more in-depth articles as well.
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); }
}

This post may contain affiliate links. See our disclosure about affiliate links here.

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

Posted by WordPress Guru