1

5 of my templates require specific Javascript. Currently the below works great to load Javascript into Page Template A.

 add_action('wp_enqueue_scripts','css-flags');
  function css-flags(){
  if ( is_page_template('page-template-a.php') ) {
   wp_enqueue_style('css-flags', get_template_directory_uri() . 
   '/css/flags.min.css', array(), '1.0.0', false );
  }
 }

I thought that I could simply do the following to add the same CSS file to Template B, C and D by just adding the template name to the 'IF' variable.

 add_action('wp_enqueue_scripts','css-flags');
  function css-flags(){
  if ( is_page_template('page-template-a.php','page-template-b.php','page-template-b.php') ) {
   wp_enqueue_style('css-flags', get_template_directory_uri() . 
   '/css/flags.min.css', array(), '1.0.0', false );
  }
 }

Thanks for all direction.

3 Answers 3

0

Page template seems like a more obscure thing to base the loading of your CSS on. Maybe not use template name, and use page name instead as it's more apparent to theme users. If interested you could try something more like this:

add_action('wp_enqueue_scripts', 'load_special_page_styles');
function load_special_page_styles() {
    global $post;

    if( is_page() ) {

        switch( $post->post_name ) { // post_name is actually the page slug            
            case 'a-page': // if page slug is equal to 'a-page'...              
            case 'b-page':
            case 'c-page':
            case 'd-page':
            case 'e-page':
                wp_enqueue_style( 'css-flags', get_stylesheet_directory_uri() . '/css/flags.min.css', array(), '1.0.0', 'all' ); // Note slight differences in use of wp_enqueue_style here
                wp_enqueue_script( 'js-flags', get_template_directory_uri() . '/js/flags.min.js', array('jquery'), '1.0.0', true ); // helpful param #2 loads jquery if not already loaded, and param #4 loads the flags.min.js script in the footer, after page content loads
                break;
        }
    } 
}
3
  • wow...! Very interesting...I'm going to test this out and ill report back Commented Aug 10, 2017 at 4:33
  • Can the same be applied for Javascript? I guess the answer is yes - but just want to be sure..! Commented Aug 10, 2017 at 4:46
  • You're right! Also it is recommended to load css and js scripts together in the same function using the wp_enqueue_scripts action hook. Commented Aug 10, 2017 at 4:56
1

is_page_template accepts a single argument, which can be a string or an array. You just need to pass your values as a single array() to make it work:

if ( is_page_template( array('page-template-a.php','page-template-b.php','page-template-b.php') ) ){
    // do stuff
}
0

In PHP, || is the OR operator so you have to build it that way feeding is_page_template() a single template so your conditional will look like this:

if ( is_page_template('page-template-a.php') || is_page_template('page-template-b.php') || is_page_template('page-template-c.php') ) {
     // Code Here
}
2
  • thanks @cedon and milo > interesting to see which one is 'more accepted'. I like the sound of the array but they both seem to be able to do exactly the same thing... Commented Aug 10, 2017 at 4:04
  • @henry functionally they will achieve the same end goal, but one call to is_page_template with an array of values will be slightly faster than calling is_page_template for each value(i.e. multiple calls to function). Commented Aug 10, 2017 at 4:32

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.