Take the 2-minute tour ×
WordPress Development Stack Exchange is a question and answer site for WordPress developers and administrators. It's 100% free, no registration required.

I will like to implement a few of the boilerplate template features in one of my instance WordPress.

I am trying to figure out how to exchange the regular jquery calls below

<script type='text/javascript' src='http:/.../wp-includes/js/jquery/jquery.js?ver=1.4.4'></script>
<script type='text/javascript' src='http://.../wp-includes/js/jquery/ui.core.js?ver=1.8.9'></script>

to this:

<!-- Grab Google CDN's jQuery, with a protocol relative URL; fall back to local if necessary -->
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.5.1/jquery.js"></script>
<script>window.jQuery || document.write("<script src='js/libs/jquery-1.5.1.min.js'>\x3C/script>")</script>
share|improve this question
add comment

1 Answer

up vote 10 down vote accepted

You should be loading jQuery with wp_enqueue_script('jquery') - that way, you won't end up with multiple instances if plugins try to load it too.

To use Google CDN, place this in your functions.php;

wp_deregister_script('jquery');
wp_register_script('jquery', 'http://ajax.googleapis.com/ajax/libs/jquery/1.5.1/jquery.min.js', array(), '1.5.1');

Update: Personally, and I know this sounds like a cop-out, but I wouldn't bother checking the CDN. Google is just so damn reliable, and it's more than likely it's already in the user's browser cache anyway (so many sites use Google's CDN).

However, in my duty to answer, you have one of two options;

  1. Check server side with a remote get, and if it fails, serve the local copy (expensive and not recommended)
  2. Run a script client-side that checks for jQuery, and prints the fallback if necessary

The trouble with 2) is that you need to inject this script right after jQuery, and before any other plugins that depend on it fire their scripts. The only way I know you can do this is to 'listen' for jQuery, then output the JavaScript on the next call.

The magic? Drop this in your functions.php;

if ( !is_admin() ) :
/**
 * Hack to display fallback JavaScript *right* after jQuery loaded.
 */
function __jquery_fallback( $src, $handle = null )
{
    static $run_next = false;

    if ( $run_next ) {
        $local = '/js/libs/jquery-1.5.1.min.js';
        echo <<<JS
<script type="text/javascript">/*//<![CDATA[*/window.jQuery || document.write('<script type="text/javascript" src="$local"><\/script>');/*//]]>*/</script>

JS;
        $run_next = false;
    }

    if ( $handle === 'jquery' )
        $run_next = true;
    return $src;
}
add_filter( 'script_loader_src', '__jquery_fallback', 10, 2 );
add_action( 'wp_head', '__jquery_fallback', 2 );
endif;

For those in the know, this is also hooked to wp_head right after wp_print_scripts would have fired, in case there were no more scripts to print after jquery (the function does it's work on the next call, rather than the instance it is called with jQuery).

share|improve this answer
    
thanks for your fast response +1 for that. Could you at least hint on how to accomplish the trick of if CDN is not available then use the local version? –  Geo Mar 19 '11 at 1:34
1  
Updated answer. –  TheDeadMedic Mar 19 '11 at 2:59
    
you are a genius. I am taking your recommendation and only keeping the CDN. Sorry for the extra trouble. I wish I could give more points to you. –  Geo Mar 19 '11 at 17:19
    
No worries, appreciate the compliments ;) –  TheDeadMedic Mar 19 '11 at 19:26
    
Wow, nice hack, you're one of the few having really solved the problem! –  Daan Aug 20 '12 at 17:04
show 2 more comments

Your Answer

 
discard

By posting your answer, you agree to the privacy policy and terms of service.

Not the answer you're looking for? Browse other questions tagged or ask your own question.