How to include jQuery in a WordPress theme?

I am pretty new to WordPress and I am figuring out how to include jQuery into a theme.

I create the following function into functions.php theme:

Read More
function load_java_scripts() {
    // Load FlexSlider JavaScript that handle the SlideShow:
    wp_enqueue_script('jQuery-js', 'http://code.jquery.com/jquery.js', array(), '1.0', true);
}
add_action('wp_enqueue_scripts', 'load_java_scripts');

So I think that I can add it as some other JavaScript or CSS local resources but I am not sure about this method because in this case the jquery.js is not a local resource but is an online resource (is it the same thing?)

I also have some doubts because searching online I have found different methods to add jQuery to my theme, like this one.

Can you give me some information about how to correctly complete this task?

Related posts

Leave a Reply

5 comments

  1. Is there any specific reason why you’re not using the jQuery found in WordPress?

    If you need to add your JavaScript file which depends on jQuery, you can add jQuery as a dependency.

    <?php
    
    function my_scripts_method() {
        wp_enqueue_script(
            'custom-script',
            get_stylesheet_directory_uri() . '/js/custom_script.js', #your JS file
            array( 'jquery' ) #dependencies
        );
    }
    
    add_action( 'wp_enqueue_scripts', 'my_scripts_method' );
    
    ?>
    

    Note that WordPress loads jQuery in no conflict wrappers. so your code should be like:

    jQuery(document).ready(function($) {
        // Inside of this function, $() will work as an alias for jQuery()
        // and other libraries also using $ will not be accessible under this shortcut
    });
    
  2. Since WP already comes with jQuery, I would simply load it for your theme, add it like this into your functions.php

    function load_scripts(){
        //Load scripts:
        wp_enqueue_script('jquery'); # Loading the WordPress bundled jQuery version.
        //may add more scripts to load like jquery-ui
    }
    add_action('wp_enqueue_scripts', 'load_scripts');
    

    There are several ways to include jQuery into a theme. I always use WP bundled version which I find very simple.

  3. try this,

    <?php
        function load_external_jQuery() {
            wp_deregister_script( 'jquery' ); // deregisters the default WordPress jQuery 
            $url = 'http://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js'; // the URL to check against  
            $test_url = @fopen($url,'r'); // test parameters  
            if( $test_url !== false ) { // test if the URL exists if exists then register the external file  
                wp_register_script('jquery', '//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js');
            }
            else{// register the local file 
                wp_register_script('jquery', get_template_directory_uri().'/js/jquery.js', __FILE__, false, '1.7.2', true);  
            }
            wp_enqueue_script('jquery'); // enqueue the jquery here
        }
        add_action('wp_enqueue_scripts', 'load_local_jQuery'); // initiate the function 
    ?>
    
  4. You can use the methods below to include jQuery:

    wp_enqueue_script( 'jquery' );  
    
    wp_enqueue_script( 'load-js-validate', 'foldername/jquery.js' );
    
    Directly add in header file.<script type="text/javascript" src="<?php bloginfo('template_directory'); ?>/js/jquery.js"></script>
    
    function js_scripts() {
    wp_enqueue_script( 'jquery', get_template_directory_uri() . '/js/example.js');
    }
    
    add_action( 'wp_enqueue_scripts', 'js_scripts' ); // add this in function file