Using jquery with wordpress using wp_enqueue_scripts

Question

I need to include jquery in a single page template of my theme. But it looks like it doesn't want to.

I tried calling it with wp_enqueue_scripts() but i does nothing. Here is what is in functions.php

add_action( 'wp_enqueue_scripts', 'custom_theme_load_scripts' );
function custom_theme_load_scripts()
{
wp_enqueue_script( 'jquery' );
}

And what I'm trying to do in page-template.php

<?php custom_theme_load_scripts(); ?>
<script type="text/javascript"> 
//stuff using jquery here

</script>

Even calling it before the header doesn't work.

I don't want to load an external jquery file since wordpress already have one, but I'm banging my head against the wall as I have no idea why it doesn't work.

Any ideas ?

Answer 1

It sounds like your template is missing a call to wp_head() which will output your enqueued scripts and styles. You'd normally place wp_head() in your header.php template and include this in your page template.

To conditionally enqueue jQuery based on the page template being used you could use the following code:

add_action( 'wp_enqueue_scripts', 'custom_theme_load_scripts' );
function custom_theme_load_scripts() { 
    if ( is_page_template( 'page-template.php' ) ) {
        wp_enqueue_script( 'jquery' );
    }   
}

Keep in mind that plugins may require jQuery and therefore enqueue it on other pages/templates.

Answer 2

What you are trying to do in page-template.php is totally wrong. Try to run conditional query while enqueing jquery. Here is the code that may help you.

add_action( 'wp_enqueue_scripts', 'custom_theme_load_scripts' );
function custom_theme_load_scripts() {
    
    // If you want to disable from all other pages
    wp_dequeue_script('jquery');

    // Add to your page template
    if( is_page_template('YOUR_TEMPLATE_NAME') ) {
        
        // Now enqueue jQuery again
        wp_enqueue_script( 'jquery' );
    }
}

If it is not page template and some other conditons like single page or single post or anything you want, WordPress has a conditional query for every condition. Checkout the following page,

https://codex.wordpress.org/Conditional_Tags

Hope this one helps :)

Answer 3

Okay, this is awkward but I resolved my own issue. jQuery was indeed charging but... I was using $this.

And as someone already said on another thread:

By default when you enqueue jQuery in Wordpress you must use jQuery, and $ is not used (this is for compatibility with other libraries).

So, you must use jquery as a selector instead of $.

Hope it can help someone else !

Thanks a everyone trying to help !