小粋空間  -  a cheap joke and a play on words site

WordPressでGoogle Libraries APIを自動的に読み込む「Use Google Librariesプラグイン」

WordPressでjQueryなどのGoogle Libraries APIライブラリを自動的に読み込むことができる「Use Google Librariesプラグイン」を紹介します。

Use Google Libraries

１．機能

jQueryなどの外部ライブラリを読み込むには、wp_deregister_script()とwp_register_script()を組み合わせることで実現できます。

例えばjQueryを読み込む場合は次のように記述します。

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

wp_deregister_script()はWordPressに登録されているスクリプトの読み込みを解除する関数、wp_register_script()はスクリプトの登録を行う関数です。wp_enqueue_script()はパラメータに指定したスクリプトを重複させずにページに出力する関数です。

が、このプラグインを利用すれば、次の1行を記述するだけで、サーバーにインストールしたWordPressにあるJavaScriptライブラリではなく、Google Libraries APIからJavaScriptライブラリを読み込んでくれます。

wp_enqueue_script( 'jquery' );

プラグイン適用前（クリックで拡大します）

プラグイン適用後（クリックで拡大します）

Google Libraries APIにあるライブラリを読み込めば、サーバーの負荷を軽減する効果や、同じライブラリがユーザーのブラウザにキャッシュされている可能性が高くなります。

マニュアルによると、このプラグインでサポートされているライブラリは以下の通りです。

• Dojo（http://dojotoolkit.org/）
• jQuery（http://jquery.com/）
• jQuery UI（http://ui.jquery.com/）
• MooTools（http://mootools.net/）
• Prototype（http://www.prototypejs.org/）
• script.aculo.us（http://script.aculo.us/）
• swfobject（http://code.google.com/p/swfobject/）

また、jQueryとprototypeを同時に定義すると、jQuery.noConflict()も自動的に設定されます。

jQueryとprototypeを同時に定義（クリックで拡大します）

２．プラグインのダウンロード・インストール

管理画面の「プラグイン」→「新規追加」をクリック。

キーワードに「Use Google Libraries」を入力して「プラグインの検索」をクリック。

「いますぐインストール」をクリック。

インストールが完了したら「プラグインを有効化」をクリック。

３．設定

冒頭に記したとおり、例えばjQueryライブラリを読み込む場合は、次の内容をテーマなどに設定します。

wp_enqueue_script( 'jquery' );

wp_enqueue_script()の詳細については「WordPressのTwenty Elevenテーマ解説：ヘッダー (header.php)：その2」の４項を参照してください。