Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

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:

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?

like image 477
AndreaNobili Avatar asked Jan 21 '14 11:01

AndreaNobili


4 Answers

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
});
like image 64
RRikesh Avatar answered Oct 07 '22 01:10

RRikesh


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.

like image 36
Th3Alchemist Avatar answered Oct 06 '22 23:10

Th3Alchemist


In wordpress No need for Custom Jquery. Add dependencies as 'jquery' it'll automatically get loaded.

like image 36
vibz Avatar answered Oct 07 '22 00:10

vibz


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 
?>
like image 22
Jobin Avatar answered Oct 07 '22 01:10

Jobin