Google AJAX Libraries API Plugin

Posted May 28, 2008 // Tagged as Plugins, development // 51 Comments ↓

Update: This plugin is no longer available.

Earlier this week Google announced their Ajax Libraries API.

The AJAX Libraries API takes the pain out of developing mashups in JavaScript while using a collection of libraries. We take the pain out of hosting the libraries, correctly setting cache headers, staying up to date with the most recent bug fixes, etc.

The Google Ajax Libraries API Plugin (what a mouthfull) is designed to make it easy to use the Google hosted libraries without the need to mess with your theme and plugin code.

When activated, the plugin will “listen” to all of the scripts added (via the WordPress wp_enqueue_script function) to your pages header and automagically switch the locally hosted library to a Google hosted one. Deactivating the plugin will remove the “listener” and your site will return to using the local versions.

WordPress MU administrators should copy the plugin into their MU-Plugins directory for it to be enabled across all of your hosted blogs.

The latest version of this plugin is available for download below.

Changelog
1.0 -4th January 2009
This version adds support for the YUI loader and swfobject.js libraries and also checks for and replaces the minimised versions of javascript libraries.
0.9 -4th September 2008
This version now uses non-version specific Google URL’s (/1/ instead of /1.6.1/, etc) to ensure that the latest hosted version of the Javascript library is loaded.
Support has also been added for the jQuery UI library (note: you need to include the jQuery library if you want to use the jQuery UI library, this plugin does not do that for you).

51 Responses

  1. TaopaiC

    May 30th, 2008 at 12:31 am

    Hello, it is a great plugin!! But it seems a problem with jquery and prototype conflicting.

    I wrote a patch for it, please refer my blog (sorry , it was written in chinese).

  2. Barry

    May 30th, 2008 at 1:52 pm

    @TaopaiC: Thanks for the message. I haven’t had a problem with jquery and prototype on the sites I’m using it on as yet - but I will have a look at your solution with a view to integrating it.

  3. xiaomo

    May 31st, 2008 at 10:09 am

    so quick~~
    thanks~~

  4. Steve

    May 31st, 2008 at 4:53 pm

    B,

    This is a great idea.

    When I got the annoucnement about Google’s API two days ago I manually commented out my existing jQuery in favor of Google’s “new way”.

    Can I ask you… let’s say I uncommented MY local jquery reference… AND have your plugin working. How does your plugin tell WordPress (or my browser) not to pay attention to my local jQuery reference? Do they have to be named exactly the same? (because I always name my local latest version to “jquery-latest.js” so that I don’t have to change my theme template whenever I want to throw up the latest jQuery version).

  5. Barry

    May 31st, 2008 at 6:16 pm

    @Steve: The plugin hooks into the interface used by wp_enqueue_script, so with jQuery for example, if any themes or plugins enqueue jQuery, the library (jquery.js) is replaced when output by the Google library (jquery-min.js). Any libraries that are hardcoded into themes or plugins are ignored.

  6. Steve

    May 31st, 2008 at 7:27 pm

    Oh, so if previously my “header.php” file was adding jQuery with a simple [script src='path/jquery.js'][/script] that wouldn’t matter one way or the other?

    Perhaps I’m enqueue ignorant. :-) I’ll have to look it up.

  7. johnbillion

    May 31st, 2008 at 11:56 pm

    Hi Barry,

    Coincidentally I also wrote and released a Google AJAX Libraries API plugin for WordPress but I’ve chosen to use the wp_print_scripts action hook instead of filtering the script_loader_src . Check out my Google AJAX Libraries API WordPress plugin.

  8. Barry

    June 3rd, 2008 at 2:46 pm

    @TaopaiC: I’ve updated the plugin to handle the loading of jQuery and Prototype on the same page. I’ve incorporated part of your solution, but have removed the need for an extra javascript file containing the noconflict code. Have a look and let me know what you think.

  9. TaopaiC

    June 4th, 2008 at 1:38 am

    It works good.

    thanks Barry :)

  10. James D Kirk

    June 7th, 2008 at 6:57 am

    Getting this little bummer (x4) at the top of my admin pages after activating the plugin:


    Warning: preg_match() [function.preg-match]: Compilation failed: unrecognized character after (?< at offset 3 in /var/www/vhosts/thefightchannel.com/httpdocs/wp-content/plugins/usegooglelibrary.php on line 26

    Thoughts?

  11. david

    June 8th, 2008 at 8:32 pm

    effects.js can be loaded from Google too…

    “/effects.js” => “http://ajax.googleapis.com/ajax/libs/scriptaculous/1.8.1/effects.js”

  12. Barry

    June 9th, 2008 at 2:24 pm

    @James D Kirk: What version of php are you using? The latest version of the plugin uses the named subpattern functionality of preg_match which may not be in early versions. if you can confirm the version you are using - then I’ll write a short workaround for it.

  13. Jordan

    June 10th, 2008 at 1:47 pm

    I’m getting the same error as James D Kirk, and I have PHP 5.

  14. Barry

    June 10th, 2008 at 2:32 pm

    @Jordan & James D Kirk: I have updated the plugin to version 0.7 and removed the named subpattern from the regular expression check. Fingers crossed this should get rid of the problem you have been having.

  15. James D Kirk

    June 10th, 2008 at 6:38 pm

    Hey Barry. Apologies, yes, like Jordan I am running php5. And the 0.7 release does seem to make those errors go away.
    New question, however, is how do we “know” your plugin is actually working? What can I check or is there code I can view to see that in fact I am pulling code from the libraries? Curious. Thanks!

  16. Barry

    June 11th, 2008 at 2:25 pm

    @James D Kirk: The easiest way is if you have Firebug installed with the Firefox browser. Have the Net tab visible when you load your page and it will show which locations it loads each part of your page from. Alternatively just look at the source of your page and check for javascript includes from Google for the jQuery and other libraries

  17. Thad

    June 13th, 2008 at 1:02 am

    Can this plugin also be used in theme files to pull in the requested javascript library if requested? The way I understand this plugin is that it adds the latest js library to your Wordpress install, not your theme files. Is this correct? If so, is there a call that I can make in my header to pull in the latest scripts into the head of my site?

  18. Barry

    June 13th, 2008 at 2:27 pm

    @Thad: In your theme, rather than including the loading of the javascript library in your theme header.php file, add something along the lines of the following to your themes functions.php file:

    if(function_exists(’wp_enqueue_script’)) {
    wp_enqueue_script(’jquery’);
    }

    This will then load the jQuery library for your theme in a manner that will make changeable to the google libraries by the plugin.

  19. Barry

    June 27th, 2008 at 6:04 pm

    The google ajax plugin is now at version 0.8. If you are using version 0.7 and DO NOT need to load the Scriptaculous libraries (e.g. effects.js, dragdrop.js) separately then you don’t need to upgrade.

  20. RT Cunningham

    July 3rd, 2008 at 4:47 pm

    I had a problem running Ajax Edit Comments and found out it was the 1.2.6/jquery.min.js. Since WordPress 2.5.1 uses 1.2.3/jquery.js, I changed that line and then AEC worked again. I don’t know why it should matter but it does.

  21. Barry

    July 3rd, 2008 at 4:58 pm

    @RT Cunningham: Thanks for the info. I’ve not had a problem with the versions yet, everything seems to function as before. Out of interest, do you know what error the Ajax Edit Comments plugin was throwing up?

  22. RT Cunningham

    July 3rd, 2008 at 5:05 pm

    No errors. The comments wouldn’t load and the buttons/links in the edit panel wouldn’t work.

  23. Barry

    July 7th, 2008 at 2:43 pm

    @david: Version 0.8 now adds checks for the indiviual scriptaculous libraries.

  24. Paul Paradise

    July 17th, 2008 at 11:22 pm

    Hi Barry,

    There’s a minor bug in the jquery-conflict code in v0.8 - replace the beginning of cs_handlejqueryconflict() with this:

    $jquerypos = array_search(’jquery’, $args);

    if(false !== $jquerypos && in_array(’prototype’, $args)) {

    In the other code, the && operator binds too tightly, resulting in the jquerypos variable not actually be the position of the array.

  25. vasco

    August 5th, 2008 at 4:56 pm

    Someone needs to post this over at http://www.ajaxtutorials.com.

  26. Hennock

    October 25th, 2008 at 6:12 am

    Hi,

    I was led here from the Photo Galleria Wordpress Plugin: http://graphpaperpress.com/2008/05/31/photo-galleria-plugin-for-wordpress/

    The author recommends we install your plugin and delete all the javascripts in our header and plugins.

    The impression I get from your description above is that this is an automated process, so we needn’t delete anything. Is that right?

    Cheers,

    Hennock

  27. Barry

    October 26th, 2008 at 3:16 pm

    @Hennock -
    The plugin only changes those javascript libraries added using the wp_enqueue_script wordpress function. Any libraries that are hardcoded within a theme are not changed, so, for example, if you are loading jquery in your theme in a hardcoded way then it won’t be switched to using the google libraries - the best method is to use the method a few comments above this to make your theme more flexible by programmatically loading the library in your theme functions.php file.

  28. [...] 1 - Baixe o plugin, clique aqui. [...]

  29. [...] Use Google Library JavaScript [...]

  30. [...] Aumentando Velocidade - Utilize a Biblioteca Google: Esse plugin utiliza a biblioteca de ajax do GooGle para utilizar em seu site. Ao invés do navegador pedir a requisição para o servidor, ele pede para o GooGle e assim aumentando a velocidade de abertura de seu site. [...]

  31. [...] appels à la main sur votre blog wordpress, j’ai , encore une fois la solution : le plugin http://blog.clearskys.net/2008/05/28/google-ajax-libraries-api-plugin/ qui s’installe comme tout plugin wordpress, en deux clics, et qui va remplacer [...]

  32. [...] 1 - Baixe o plugin, clique aqui. [...]

  33. dentrite

    January 4th, 2009 at 3:31 am

    This is a great plugin!

  34. [...] The default setting for the Google Ajax plugin is to load the latest version of each of the Javascript libraries that Google [...]

  35. [...] I’ve just uploaded version 1.0 of the Google Ajax Libraries plugin, which is available from the Google Code download [...]

  36. WordPress Plugin Releases for 01/09

    January 9th, 2009 at 5:05 pm

    [...] Google AJAX Libraries API [...]

  37. [...] Google AJAX Libraries API [...]

  38. [...] Google AJAX Libraries API [...]

  39. Rich

    January 9th, 2009 at 10:40 pm

    Very useful for a lot of folk! I was thinking about writing one similar to this myself, but this one looks spot on - Well done!

  40. ovidiu

    January 14th, 2009 at 8:47 am

    activated version 1.0 today and everytime I go to the plugins page now, FF3 hangs and IE6 tells me there is an unresponsive script and I can only use the backend if I tell IE6 to stop the script. any idea how I can find out with what other plugin this coudl conflict? anyone else having these problems?

  41. Barry

    January 16th, 2009 at 3:05 am

    @ovidiu - That’s a strange one. Did you have any problems with the 0.9 version? If you haven’t tried the earlier version, pop me a message and I’ll send you through the link to it-

  42. ovidiu

    January 20th, 2009 at 7:25 am

    @Barry - sorry for the late response, was on holiday. haven’t tried version 0.9 send it through to the email I provide here please.

  43. ovidiu

    January 20th, 2009 at 7:45 am

    @Barry - helped myself: http://clearskys-miscplugins.googlecode.com/files/usegooglelibrary09.zip but still having the problem. sorry to have bothered you :-( seems to be an incompatibility with something, but I still don’t get this, why would it only occur on the plugin page in the backend?

  44. Cristian

    January 20th, 2009 at 11:58 am

    really good plugin. thank you.
    it would be very helpful if the plugin took into account the version of the js library instead of retrieving the latest version of a library

  45. Barry

    January 20th, 2009 at 1:15 pm

    @Cristian -
    I wanted it to be “self-updating” with javascript library versions, rather than having to upgrade the plugin with every library/wordpress version.
    If you want to enforce a version then you can use the technique in this post:
    http://blog.clearskys.net/2009/01/04/fixing-javascript-compatibility-issues-with-the-google-ajax-plugin/

    @ovidiu - I wonder what would happen if you fixed the jquery library to the version that comes with WordPress, rather than the latest version available?

  46. Sudar

    February 1st, 2009 at 6:45 am

    Thanks for the wonderful Plugin.

    I was planning to write one myself and I am glad that you wrote one and saved a couple of minutes for me. Thanks :)

  47. [...] Google AJAX Libraries API Plugin: this plugin taps into Google’s Ajax Libraries API, ensuring that all scripts on your site are accessing the latest versions, which usually include performance improvements and bugfixes. [...]

  48. [...] Use Google Library Javascript 1.0 » clearskys.net (url) This plugin automatically replaces local calls for javascript libraries for those supported by the Google Library API. [...]

  49. Mike

    June 17th, 2009 at 5:26 am

    The download link doesn’t appear to be working??

  50. Barry

    June 17th, 2009 at 10:37 am

    Thanks for letting me know.

  51. Ben

    June 25th, 2009 at 9:01 pm

    the script seems to disable the html editor function of the visual editor in the wordpress admin area, is there a fix?

Leave a Reply