1

Trying to run a custom script on a single page using is_page in functions.php not working at all. I have a function called load_gh_boards that would enquque a script, only on a certain page (79):

function load_gh_boards() {
if( is_page(79) ){
    wp_register_script( 'gh-jobs-board', get_bloginfo( 'template_directory' ) . '/js/gh-jobs-board.js', array(), '1.0', true );
}}
add_action('wp_enqueue_script', 'load_gh_boards');

This is inside a theme enqueue function that is loading all of my styles and scripts:

function theme_enqueue() {
if ( ! is_admin() ) {

    wp_register_style( 'main-style', get_bloginfo( 'template_directory' ) . '/css/style.css?' . time() );
    wp_enqueue_style( 'main-style' );
    wp_enqueue_script( 'jquery' );
    wp_register_script( 'main-vendor', get_bloginfo( 'template_directory' ) . '/js/vendor.js', array(), '1.0', true );
    ///etc...

    wp_enqueue_script( 'main-vendor' );
    wp_enqueue_script( 'main-script' );

    ///load_gh_boards
}

No result. Any help or insight at all would be appreciated.

1
  • 1
    Please don't replace the wrong code in your question with the correct code from the answer. If you do this, future visitors won't have a chance to understand the problem. – Jack Johansson Aug 29 '17 at 22:24
2

is_page(79) is asking if the current main query is a page, specifically page 79

But the main query hasn't happened yet

This function has to be called inside the main loop or at the very least inside the template, but the init hook is way too early for this.

Instead, make sure you use the body class, and load the script on all pages. Then, check if the body tag has the css class page-id-79.

Other Notes

  • You don't enqueue on the init hook, you're meant to enqueue on the wp_enqueue_scripts hook
  • It would be simpler to return early e.g. if ( is_admin() ) return;
  • Don't enqueue jQuery, instead add it as a dependency so WP knows how to output the scripts in the correct order
  • main-style and main-vendor are very generic names, you might encounter clashes, prefix them, e.g. pji-main-vendor
  • theme_enqueue is also a very generic function name, you should prefix that too
  • You can register and enqueue at the same time using wp_enqueue_script. If you pass everything to that function there's no need to call wp_register_script
  • Indent your code, modern code editors will do this automatically for free, zero effort. Sublime or Atom are examples of free software that will do this for you, there really are no excuses
5
  • So basically you're saying to forget the conditional tag and use javascript to determine whether the page has the class. I had initially thought to do it this way but it seemed to me that a WP approach would be much cleaner... – pjldesign Aug 29 '17 at 19:49
  • just added code to footer.php. <?php if ( is_page('join-us')) { echo '<script type="text/javascript" src="http://...wp-content/themes/.../js/gh-jobs-board.js"></script>'; } ?> – pjldesign Aug 29 '17 at 20:50
  • There are other ways of doing it, but you should definately do it via the enqueue system – Tom J Nowell Aug 29 '17 at 20:55
  • If the script can't be loaded in the functions.php (because of the necessity of a is_page function), then how do I enqueue it with the others? – pjldesign Aug 29 '17 at 22:13
  • The problem is not how you're doing it, but when you're doing it, the init hook is way too early – Tom J Nowell Aug 29 '17 at 23:27
4

This is absolutely working for me right now:

add_action('get_header', function() {
    if(is_page('566')) {

        function sp_enqueue_script() {
            wp_enqueue_script(
                'sp-custom-script',
                get_stylesheet_directory_uri() . '/assets/js/sp_script.js',
                array( 'jquery' ), '1.0', true
            );
        }

        add_action( 'wp_enqueue_scripts', 'sp_enqueue_script' );
    }
});

is_page doesn't work in functions.php because the main query hasn't loaded yet, so wait for the header to load.

Last boolean in the wp_enqueue_script hook is for the script to be enqueued in the footer, so it runs faster.

1
function theme_enqueue() {
if ( ! is_admin() ) {
wp_register_script( 'main-script', get_bloginfo( 'template_directory' ) . '/js/script.js', array(), '1.0', true );
wp_register_script( 'gh-jobs-board', get_bloginfo( 'template_directory' ) . '/js/gh-jobs-board.js', array(), '1.0', true );
///etc...
wp_enqueue_script( 'main-vendor' );
wp_enqueue_script( 'main-script' );
///etc...

if( is_page(79) ) {
    wp_enqueue_script( 'gh-jobs-board' );
}
}
}
add_action( 'wp_enqueue_scripts', 'theme_enqueue' );
0

First of all, there is a mistype in your code. It's wp_enqueue_scripts, not wp_enqueue_script. That might be the issue.

Also, you shouldn't use wp_enqueue_scripts inside another wp_enqueue_scripts. Simply add your conditional in the theme_enqueue() function like this:

function theme_enqueue() {
if ( ! is_admin() ) {

    wp_register_style( 'main-style', get_bloginfo( 'template_directory' ) . '/css/style.css?' . time() );
    wp_enqueue_style( 'main-style' );
    wp_enqueue_script( 'jquery' );
    wp_register_script( 'main-vendor', get_bloginfo( 'template_directory' ) . '/js/vendor.js', array(), '1.0', true );
    ///etc...

    wp_enqueue_script( 'main-vendor' );
    wp_enqueue_script( 'main-script' );

    if( is_page(79) ){
        wp_register_script( 'gh-jobs-board', get_bloginfo( 'template_directory' ) . '/js/gh-jobs-board.js', array(), '1.0', true );
    }
}
add_action('wp_enqueue_scripts', 'theme_enqueue');

I assume that the theme_enqueue() function is hooked to wp_enqueue_scripts itself.

3
  • Thanks. I've updated the code. I don't believe the issue is with wp_enqueue_script -- this code was working before I started this change. – pjldesign Aug 29 '17 at 19:40
  • The init hook is too soon for enqueuing scripts. Use wp_enqueue_scripts instead. – Jack Johansson Aug 29 '17 at 20:03
  • switched init to wp_enqueue_scripts in functions.php. Works. Changed the code above. Thanks all. – pjldesign Aug 29 '17 at 22:19
0

You Register the Script, but you don't enqueue it. Add wp_enqueue_script('gh-jobs-board'); to your conditional function.

1
  • Thanks I've updated the code --- still not working but closer. – pjldesign Aug 29 '17 at 19:36

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.