0

I am trying to have multiple separate style sheets load for each page (page specific) for a WordPress website. I am converting an HTML website to a WordPress website for a client. For example; home.css & consol.css for the home page (home.php) and pricing-hours.css & consoltwo.css for pricing-hours.php. I am trying to do this using the functions.php file, with code I have so far below:

function everydaytherapy_script_enqueue() {        
    if ( is_page_template( 'home.php' ) ) {
        wp_enqueue_style('customstyle', get_template_directory_uri() . 'https://maxcdn.bootstrapcdn.com/font-awesome/4.4.0/css/font-awesome.min.css', array(), '1.0.0', 'all');
        wp_enqueue_style('customstyle', get_template_directory_uri() . 'https://d1azc1qln24ryf.cloudfront.net/47089/SocialIconsNCD/style-cf.css', array(), '1.0.0', 'all');
        wp_enqueue_style('customstyle', get_template_directory_uri() . '/css/baile.css', array(), '1.0.0', 'all');
        wp_enqueue_style('customstyle', get_template_directory_uri() . '/css/consolidated-0.css', array(), '1.0.0', 'all');
        wp_enqueue_script('customjs', get_template_directory_uri() . '/js/javascript.js', array() '1.0.0', bool $in_true);
    }    
    elseif ( is_page_template( 'pricing-hours.php' ) ) {     
        wp_enqueue_style('customstyle', get_template_directory_uri() . 'https://maxcdn.bootstrapcdn.com/font-awesome/4.4.0/css/font-awesome.min.css', array(), '1.0.0', 'all');
        wp_enqueue_style('customstyle', get_template_directory_uri() . 'https://d1azc1qln24ryf.cloudfront.net/47089/SocialIconsNCD/style-cf.css', array(), '1.0.0', 'all');
        wp_enqueue_style('customstyle', get_template_directory_uri() . '/css/pricing-hours.css', array(), '1.0.0', 'all');
        wp_enqueue_style('customstyle', get_template_directory_uri() . '/css/consolidated-0.css', array(), '1.0.0', 'all');
        wp_enqueue_script('customjs', get_template_directory_uri() . '/js/javascript.js', array() '1.0.0', bool $in_true); }
    } else {
  • 1
    You need to hook into an event after the page has been chosen. You could be checking for page information before the query is processed which won't help. Try an event after 'template_redirect'. – jgraup Aug 7 '16 at 19:46
  • So I should replace the enqueue styles with 'template_redirect' instead of what I currently have 'template_directory'? Does that apply to only the "elseif" style sheets? Thank you! – Deirdre Mc T Aug 8 '16 at 13:07
  • Is pricing-hours.php a page template? – bravokeyl Aug 9 '16 at 5:54
0

home.php is a template file used for displaying blog posts whether it is a homepage(front page) or any other page which is set to display blog posts.

You cannot use is_page_template('home.php') as it is not considered a page template instead you can use is_front_page() or is_home() to identify the front page.

is_front_page() always return true if we are on the frontpage/homepage that is if we are on http://example.com where as is_home() returns true only if the page that we are on is set to display blog posts or the frontpage is displaying blog posts.

I guess in your case is_front_page() works and for checking the pricing-hours.php conditional it should be a page template.

function everydaytherapy_script_enqueue() {
    if ( is_front_page() ) {
       //Here en-queue scripts for the front page
    }elseif(  is_page_template( 'pricing-hours.php' ) ){
      // Here en-queue scripts for page template pricing-hours
    }else {
      //scripts for other pages
    }
}
add_action( 'wp_enqueue_scripts', 'everydaytherapy_script_enqueue' );

Note:

Remember to have different handles for different styles or scripts don't use same handle for two different css files.

  • Thank you to the both of you. I have the style sheets working properly now. Just have to sort out the js and jquery. The "is_front_page" and "is_page" functions worked. Also creating a unique handle for each one was key. – Deirdre Mc T Aug 9 '16 at 19:56
0

try this instead:

Add this to your theme functions.php

function everydaytherapy_script_enqueue() {  
if( is_page_template('pagetemplate-this.php') && is_page_template('pagetemplate-that.php') && is_page_template('pagetemplate-other.php') ) {
wp_enqueue_style('customstyle', get_template_directory_uri() . 'https://maxcdn.bootstrapcdn.com/font-awesome/4.4.0/css/font-awesome.min.css', array(), '1.0.0', 'all');
        wp_enqueue_style('customstyle', get_template_directory_uri() . 'https://d1azc1qln24ryf.cloudfront.net/47089/SocialIconsNCD/style-cf.css', array(), '1.0.0', 'all');
        wp_enqueue_style('customstyle', get_template_directory_uri() . '/css/baile.css', array(), '1.0.0', 'all');
        wp_enqueue_style('customstyle', get_template_directory_uri() . '/css/consolidated-0.css', array(), '1.0.0', 'all');
        wp_enqueue_script('customjs', get_template_directory_uri() . '/js/javascript.js', array() '1.0.0', bool $in_true);
}
add_action( 'wp_enqueue_scripts', 'everydaytherapy_script_enqueue' );

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

or use is_page - 'PAGE_ID': https://developer.wordpress.org/reference/functions/is_page/

function everydaytherapy_script_enqueue() {  

    if ( is_page( array( 'about', 'services', 'contact') )) {
        wp_enqueue_style('customstyle', get_template_directory_uri() . 'https://maxcdn.bootstrapcdn.com/font-awesome/4.4.0/css/font-awesome.min.css', array(), '1.0.0', 'all');
        wp_enqueue_style('customstyle', get_template_directory_uri() . 'https://d1azc1qln24ryf.cloudfront.net/47089/SocialIconsNCD/style-cf.css', array(), '1.0.0', 'all');
        wp_enqueue_style('customstyle', get_template_directory_uri() . '/css/baile.css', array(), '1.0.0', 'all');
        wp_enqueue_style('customstyle', get_template_directory_uri() . '/css/consolidated-0.css', array(), '1.0.0', 'all');
        wp_enqueue_script('customjs', get_template_directory_uri() . '/js/javascript.js', array() '1.0.0', bool $in_true);
    }

add_action( 'wp_enqueue_scripts', 'everydaytherapy_script_enqueue' );

Let me know if this is working.

  • It would be great if you give more info as how it helps. – bravokeyl Aug 9 '16 at 5:52
  • 1
    I edited my answer @bravokeyl – Jerome D. Dizon Aug 9 '16 at 6:11
0

Here is the code that worked for me in the functions.php file of my Wordpress theme. Thanks a million lads for the help. I couldn't post the code as a response so had to do it as an answer here. Sorry for the confusion.

<?php
function every_theme_styles() { 

    wp_enqueue_style( 'bootstrap_css', 'https://maxcdn.bootstrapcdn.com/font-awesome/4.4.0/css/font-awesome.min.css' );

    wp_enqueue_style( 'social_css', 'https://d1azc1qln24ryf.cloudfront.net/47089/SocialIconsNCD/style-cf.css' );


    wp_enqueue_style( 'stacks_css', get_template_directory_uri() . '/css/stacks.css' );


if ( is_front_page() ) {

  wp_enqueue_style( 'consol_1_css', get_template_directory_uri() . '/css/consolidated-0.css' );

    wp_enqueue_style( 'baile_css', get_template_directory_uri() . '/css/baile.css' );
   }

if ( is_page( 'hours-pricing' ) ) { 

    wp_enqueue_style('pricing_css', get_template_directory_uri() . '/css/pricing-hours.css');

    wp_enqueue_style('consol_4_css', get_template_directory_uri() . '/css/consolidated-4.css');
    }


if ( is_page( 'our-facility' ) ) { 

    wp_enqueue_style('facility_css', get_template_directory_uri() . '/css/our-facility.css');

    wp_enqueue_style('consol_1_css', get_template_directory_uri() . '/css/consolidated-1.css');
    }   

}

add_action( 'wp_enqueue_scripts', 'every_theme_styles' );

function every_theme_js() {

wp_enqueue_script( 'header_javascript_js', get_template_directory_uri() . '/js/header_javascript.js', '', '', false );       
 }
add_action('wp_enqueue_scripts', 'every_theme_js' );
?>

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.