Forums

jonedwards

Hi there

I've kinda asked this question before, but have never really solved it the way I would have liked to…

I want to register all of my jQuery scripts - in their stacking order - in my functions.php file, rather than placing then in the header.php file.

I have the following sitting in the head of my HTML / header.php file.


<! -- dynamic wp head stuff loads here -- >
<?php wp_enqueue_script('jquery'); ?>
<?php wp_head(); ?>
<! -- dynamic wp head stuff ends here -- >
<! -- ie-html5-fix -- > 
<! -- [if lt IE 9]><! [endif] -->
<! -- /ie-html5-fix -- >
<! -- scripts -- >
/js/jquery.lightbox.min.js">
/js/jquery-calls.js">
<! -- scripts -- >

I'm already familiar with Chris' method of including jQuery the right way, but that's only including one .js file (from Google's hosted service). But I want to include - in the following order:

jQuery 1.8.2
HTML5 Shiv
jQuery Lightbox (which is in a "js" folder in my theme's root)
jQuery Calls (which is also in the "js" folder in my theme's root)

I've tried to use the following before (in addition to Chris' jQuery the right way function):


function my_jquery() {
wp_register_style( 'jquery_calls', bloginfo('template_url') . '/js/jquery-calls.js' );
wp_enqueue_script( 'jquery_calls' );
}add_action('init', 'my_jquery');

…but I've never gotten this to work.

Any help would be appreciated. Ideally, I'm looking for a snippet of code…

Thanks in advance.

Vermaas

function load_js() {
wp_enqueue_script( 'myprefix_js', bloginfo('template_directory') . '/js/my-js.js');
}
add_action('wp_footer', 'load_js');

This should do the trick. Worked always for me. You could change the action to 'wp_enqueue_scripts' (instead of wp_footer) if you want.

For the ins and outs about this subject: http://wp.tutsplus.com/tutorials/the-ins-and-outs-of-the-enqueue-script-for-wordpress-themes-and-plugins/

jonedwards

Hi Vermaas (and others)

Thank you for the reply… So would this work?

if (!is_admin()) add_action("wp_enqueue_scripts", "my_jquery_enqueue", 11);
function my_jquery_enqueue() {
   wp_deregister_script('jquery');
   wp_register_script('jquery', "http" . ($_SERVER['SERVER_PORT'] == 443 ? "s" : "") . "://ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js", false, null);
   wp_enqueue_script('jquery');
}

function load_my_scripts(){
  if (!is_admin()){
    if (is_singular() AND comments_open() AND (get_option('thread_comments') == 1)) wp_enqueue_script('comment-reply');
    wp_enqueue_script( 'jquery_lightbox', bloginfo('template_directory') . '/js/jquery.lightbox.min.js');
    wp_enqueue_script( 'jquery_calls', bloginfo('template_directory') . '/js/jquery-calls.js');
  }
}
add_action('get_header', 'load_my_scripts');

Thanks in advance.

Vermaas

Nope, won't work, because you try to put it into get_header. That's a wrong hook. Try wp_head (or like I prefer) wp_footer.

That should work.

jonedwards

Hi

Right. So other than my incorrect hook, that should work?

I do prefer scripts in the head rather than in the footer of sites.

Thanks

jonedwards

Hi

I've tried tried my code listed above (and using the wp_head hook), but all I end up with is random lines of text showing the theme directory path at the very top of my page...

Any suggestions?

Thanks

treehouse : what would you like to learn today?

Forums

[Solved] Register and call jQuery scripts in WordPress