Include jQuery into Wordpress template Include jQuery into Wordpress template wordpress wordpress

Include jQuery into Wordpress template


You should use wp_enqueue_script() in your functions.php file, not your header.php. (and you're adding jQuery twice)

functions.php:

function my_scripts_method() {    wp_enqueue_script( 'jquery' );    wp_enqueue_script( 'jquery-ui', get_template_directory_uri() . '/js/JQueryUI.js', );    wp_enqueue_script( 'slider', get_template_directory_uri() . '/js/slider.js' );    wp_enqueue_script( 'gallery', get_template_directory_uri() . '/js/gallery.js' );}add_action( 'wp_enqueue_scripts', 'my_scripts_method' );

You should also note that WordPress enqueues jQuery in noConflict mode, so you'll need noConflict wrappers to be able to use $:

jQuery(document).ready(function($) {    // your code here});

Then you just call wp_head() and WordPress will automatically add those javascripts to your page.


As you can see here: Function Reference/wp head, in the In twentyten theme example they added a note:

/* Always have wp_head() just before the closing </head> * tag of your theme, or you will break many plugins, which * generally use this hook to add elements to <head> such * as styles, scripts, and meta tags. */

this just says you need to put the wp_head(); function just befor closing the <head></head>.

so try on putting this line:

<?php wp_head(); ?>

as the last line before closing the <head> in you'r site.

and another problem i have seen is that you forgot to end the php lines with ;

it is very critical !

with the code you gave here, change it with this:

<?php wp_enqueue_script("jquery"); ?>           <script type="text/javascript" src="<?php bloginfo('template_url'); ?>/js/jQuery.js"></script>    <script type="text/javascript" src="<?php bloginfo('template_url'); ?>/js/JQueryUI.js"></script>    <script type="text/javascript" src="<?php bloginfo('template_url'); ?>/js/slider.js"></script>    <script type="text/javascript" src="<?php bloginfo('template_url'); ?>/js/gallery.js"></script>    <?php wp_head(); ?>