Use functions.php file to call specific style sheet when a unique Wordpress page template is used

Question

I have a responsive Wordpress theme from "Elegant Themes" that works well, but there's a page that I wish to be non-responsive. I created a style sheet that successfully renders the site non-responsive, but I only want to it to use the said style sheet when a particular page template is used.

I've determined that the logic is probably executed it the functions.php file, and that I'll likely need to use "wp_enqueue_style", but I can't seem to crack it. Here's what I have right now (my addition is below Loads the main style sheet comment:

function et_nexus_load_scripts_styles(){
global $wp_styles;

$template_dir = get_template_directory_uri();

if ( is_singular() && comments_open() && get_option( 'thread_comments' ) )
    wp_enqueue_script( 'comment-reply' );

wp_enqueue_script( 'superfish', $template_dir . '/js/superfish.js', array( 'jquery' ), '1.0', true );

wp_enqueue_script( 'nexus-custom-script', $template_dir . '/js/custom.js', array( 'jquery' ), '1.0', true );
wp_localize_script( 'nexus-custom-script', 'et_custom', array(
    'mobile_nav_text' => esc_html__( 'Navigation Menu', 'Nexus' ),
    'ajaxurl'         => admin_url( 'admin-ajax.php' ),
    'et_hb_nonce'     => wp_create_nonce( 'et_hb_nonce' ),
) );

$et_gf_enqueue_fonts = array();
$et_gf_heading_font = sanitize_text_field( et_get_option( 'heading_font', 'none' ) );
$et_gf_body_font = sanitize_text_field( et_get_option( 'body_font', 'none' ) );

if ( 'none' != $et_gf_heading_font ) $et_gf_enqueue_fonts[] = $et_gf_heading_font;
if ( 'none' != $et_gf_body_font ) $et_gf_enqueue_fonts[] = $et_gf_body_font;

if ( ! empty( $et_gf_enqueue_fonts ) ) et_gf_enqueue_fonts( $et_gf_enqueue_fonts );

/*
 * Loads the main stylesheet.
 */

if ( is_page_template('custom-pagetemplate.php') ) {
    wp_register_style( ‘custom-style’,  get_stylesheet_directory_uri() . ‘/customstyles.css’  );
    wp_enqueue_style( ‘custom-style’ );
} else {
    wp_enqueue_style( 'nexus-style', get_stylesheet_uri() );
}    
}
add_action( 'wp_enqueue_scripts', 'et_nexus_load_scripts_styles' );

From what I can tell, I have my condition set up correctly using is_page_template, but it definitely isn't using the right style sheet to load the page.

Note: I posted this question to Elegant Themes' customization support board, and the moderator said that what I'm trying to do is possible, but it would necessitate a level of customization that would require me to hire a third party developer.

Having said that, if I'm missing something huge here and need to pick up a PHP book (I know very little about PHP), or shell out some cash to hire someone to get this done, please don't hesitate to set me straight. Otherwise, any input is much appreciated.

Thanks!

Answer 1

Sorry to jump the gun and answer my own question to quickly, but I got it working using the following code:

if ( is_page_template('custom-pagetemplate.php') ) {
wp_enqueue_style( 'custom-style', get_template_directory_uri() . '/customstyle.css' ); 
} else {
wp_enqueue_style( 'nexus-style', get_stylesheet_uri() );
}    
}
add_action( 'wp_enqueue_scripts', 'et_nexus_load_scripts_styles' );

My primary issue was that I was using get_stylesheet_directory_uri() instead of get_template_directory_uri.

This article helped me out a lot: How to enqueue a custom stylesheet via functions.php in WordPress

Thanks!

Answer 2

You can do something similar to this:

    if(is_page($page)) { 
     // Load non responsive css
    } 
    else { 
    // load normal css
    }

http://codex.wordpress.org/Function_Reference/is_page