jQuery from Google CDN; fall back to WP local

  • Using the following to load Google’s CDN version of jQuery, then, for the few times when (and few countries where) Google is unavailable, fall back to the copy installed with WordPress. This works fine inserted in a doc’s <head> (in header.php, for instance):

    <!-- Grab Google CDN's jQuery; if that fails, fall back to WP local copy -->
<?php wp_enqueue_script( 'jquery' ); ?>
<script type="application/x-javascript">!window.jQuery && document.write('<script src="/wp-includes/js/jquery/jquery.js"><\/script>')</script>

    In my functions.php I’ve de- and re- registered 'jquery' so it loads Google’s vers, as described in the codex: wp enqueue script. The <script> line above is lifted from: HTML5 Boilerplate.

    One slight prob is if I put the <script> in footer.php, the fall back fails. Otherwise, all seems to work well. So, I’m just wondering if anyone has a better solution, or sees some flaw in mine. Thanks.

Viewing 6 replies - 1 through 6 (of 6 total)
  • sta1r

    (@amucklow)

    Would it work if you linked to the fallback script using:

    src="<?php echo ABSPATH . 'wp-includes/js/jquery/jquery.js'; ?>"

    ?

    Thread Starter Barrett Golding

    (@hearvox)

    thanks for reminding me about this: i’ve since realized the code above does NOT work. it is loading both versions, the Google and the WP. but with fresh eyes this morn, i found what does seem to work:

    in header.php insert (before wp_head();):
    wp_enqueue_script( 'jquery' );

    then in footer.php put:
    <script type="application/x-javascript">!window.jQuery && document.write('<script src="/wp-includes/js/jquery/jquery_test.js"><\/script>')</script>

    this seems to work: if Google’s copy fails to load, the WP copy loads. never loads both. thanks for the prod to fix this.

    Thread Starter Barrett Golding

    (@hearvox)

    if your WP files are not in the root directory, you can either insert the sub-dir name in above script src=, or use this js instead in footer:

    <script type="application/x-javascript">!window.jQuery && document.write('<script src="<?php echo site_url() . "/wp-includes/js/jquery/jquery.js"; ?>"><\/script>')</script>

    Thanks hearvox!

    I load all my JS in the head (because I need to). How do I ensure I have a fallback for a CDN in the header?

    I had something like this (see below) which worked until I moved it into functions.php with enqueue stuff.

    <script src="//ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.min.js" type="text/javascript"></script>
<script type="text/javascript">
      if (!window.jQuery) {
         document.write(unescape("%3Cscript src='<?php bloginfo('wpurl');?>/tpl/js/jquery/jquery-1.6.2.min.js' type='text/javascript'%3E%3C/script%3E"));
      }
   </script>

    Thanks.

    Here’s a thought. If google’s version doesn’t load, then we’re loading the local version without deregistering and enqueuing the script. I believe that as mentioned in other blogs, some plugins won’t work with jQuery properly if the script isn’t enqueued.

    However, the current method of ensuring google’s version loads required javascript, thus it’s already to the client and registering the script is no longer an option. Any way to check google’s version with php?

    Granted, every website should fall back gracefully without javascript, and in the unique circumstances google’s doesn’t load, combined with the few plugins that doesn’t play nice without an enqueued script, we’ll, it’s talking IE6 kind of compatibility requirements. I haven’t seen what plugins do when they don’t play nice, but I’m guessing they degrade gracefully as if js wasn’t on.

    Any thoughts?

Viewing 6 replies - 1 through 6 (of 6 total)
  • The topic ‘jQuery from Google CDN; fall back to WP local’ is closed to new replies.