Load specific scripts on specific page WordPress

Hello friends, welcome to my another blog post how to load specific scripts on a specific page in WordPress. Suppose you have a google map js script and you want to include it only in contact us page. So what you will do. How you write your code to display it only in contact us page. So now I will discuss page specific condition to solve this kind of problem. Below are some solutions:

Load specific scripts on specific page



Load script only in Home Page or Front Page

<?php 
if ( is_front_page() ) {
	// Your value	
	wp_enqueue_script( 'isotope-js', get_template_directory_uri() . '/js/jquery.isotope.min.js', array( 'jquery' ), '', false );
}
?>

Load script only in Home Page if your blog page is set as home page

<?php 
if ( is_home() ) {
	// Your value	
	wp_enqueue_script( 'isotope-js', get_template_directory_uri() . '/js/jquery.isotope.min.js', array( 'jquery' ), '', false );
}
?>

Load script only in Custom Archive Page like portfolio

<?php
// Here portfolio is your custom post type name
if ( is_post_type_archive('portfolio') ) {
	// Your value	
	wp_enqueue_script( 'isotope-js', get_template_directory_uri() . '/js/jquery.isotope.min.js', array( 'jquery' ), '', false );
}
?>

Load script only in Custom Page Template like contact.php

<?php
// Here contact.php is your custom page template name
if ( is_page_template( 'contact.php' ) ) {
	// Your value	
	wp_enqueue_script( 'isotope-js', get_template_directory_uri() . '/js/jquery.isotope.min.js', array( 'jquery' ), '', false );
}
?>

Load script only in specific Page created from WordPress admin Pages section with default teaplate

<?php
// Here 42 is your page id
if ( is_page( 42 ) ) {
	// Your value	
	wp_enqueue_script( 'isotope-js', get_template_directory_uri() . '/js/jquery.isotope.min.js', array( 'jquery' ), '', false );
}
?>

<?php
// Here about is your page slug
if ( is_page( 'about' ) ) {
	// Your value	
	wp_enqueue_script( 'isotope-js', get_template_directory_uri() . '/js/jquery.isotope.min.js', array( 'jquery' ), '', false );
}
?>

See the below image to get page id or page slug for any page
Page Slug

So now you know how to load specific scripts on a specific page in WordPress. You can use this coding to load js scripts, CSS scripts or any other purpose. If you find this article useful, do share it on Facebook and Google plus. If you have any questions regarding this article, feel free to ask via comment.

Spread the love
  •  
  •  
  •  
  •  
  •  
  •  
  •  
  •  
  •  
  •