Loading Scripts on Specific Pages

by

In child theme I created a functions.php file that loads scripts and style files, the code is below.
The section that loads libraries and scripts to all pages other than admin, in other words the first two functions, works as expected.
However, the third function, which is designed to load a script for a specific page does not load.
It appears that my problem has to do with specifying the page condition. The rest of the code for register and enqueue works if it is placed in the general function that loads scripts for any page other than admin pages.
I’ve researched this can can’t find any examples showing why the approach I’ve used is not working.
I’ve swapped the page id with the name of the page but to no avail.

Any suggestion on the source of the problem would be much appreciated.

Thanks.

    <?php

function scripts () {
    if ( !is_admin() ) { 
        wp_enqueue_script('jquery');
        wp_register_script('jqueryUI', "path", array('jquery')); //register custom UI library
        wp_enqueue_script('jqueryUI');
        wp_register_script('popUp1', ("path"), array('jquery', 'jqueryUI'));
        wp_enqueue_script('popUp1');
        wp_register_script('popUpText', 'path', array('jquery', 'jqueryUI'));
        wp_enqueue_script('popUpText');
    }
}

add_action('init', 'scripts');

//INSERT CSS    files into the header
function styles () {
    if ( !is_admin() ) {
        wp_register_style('jqueryUIcss', "path");
        wp_enqueue_style('jqueryUIcss');
        wp_register_style('valuecss', "path");
        wp_enqueue_style('valuecss');
    }
}   
    add_action('init', 'styles');

//Add scripts for pop ups on "how to estimate value" page
function pagePopUps1 () {
    if ( is_page(16)) { 
        wp_register_script('popUpVideo1', "path", array('jquery', 'jqueryUI'));
        wp_enqueue_script('popUpVideo1');

    }
}

add_action('init', 'pagePopUps1');  



//End of file
?>

Note for the sake of brevity I removed the src’s but these have been validated and are not the source of the problem.

2 Answers
2

I’d suggest moving the script registering into the init action, and moving the enqueue(s) into a callback hooked onto wp_print_scripts.

Eg.

add_action( 'init', 'register_those_scriptsNstyles' );

function register_those_scriptsNstyles() {
    wp_register_script( .. your script params .. );
    wp_register_style( .. your style params ..  );

    ..etc..
}

add_action( 'wp_print_scripts', 'enqueue_those_scriptsNstyles' );

function enqueue_those_scriptsNstyles() {

    if( !is_page( 'some-page' ) ) // If it's not the given page, stop here
        return;

    wp_enqueue_script( .. your script params .. );
    wp_enqueue_style( .. your style params .. );

    ..etc..
}

NOTE: Despite the hook name, i’m pretty sure wp_print_scripts should also be fine for enqueuing styles to. The important factor is to just ensure the hook you use occurs late enough for the conditional template tags to be set, ie. is_page, is_category and so on..
If not, try wp_head instead.. eg. add_action( 'wp_head', 'your-callback' )

EDIT: For styles, just like the admin side, the public facing side has an action for styles to.. which is wp_print_styles..(hook enqueues for styles to there).

Hope that helps..

Leave a Comment