iGoogleガジェット制作の基本

2008年5月14日(水)
栗栖 義臣

はじまりはいつも"Hello, world!"

 前回はGoogleガジェットの使い方やその利点について解説しました。今回は、Googleガジェットの作り方を解説します。

 Googleガジェットは、XMLを書いて作ります。

 百聞は一見にしかずということで、Googleがサンプルとして提供しているHello Worldと表示するガジェットのXMLを見てみましょう。

 Moduleタグの子要素にModulePrefsタグとContentタグがあり、Contentタグの中にCDATAとして"Hello, world!"の記述があります。では、これをiGoogle上で表示してみましょう。

 iGoogleにログインし、iGoogleのページ右上の「コンテンツを追加」をクリックします。もしくはこのページを表示します。

 ページ左側のメニューバー下に「フィードやガジェットを追加」というリンクがあるので、そこをクリックしましょう。

 URLを入力する欄と「追加」ボタンが表示されるので、先ほどのHello worldガジェットのURLを入力して、「追加」ボタンを押します。

 「追加されました」という旨のメッセージが表示されたら、メニュー欄上部にある「iGoogleホームに戻る」をクリックして、iGoogleのページを表示させましょう。

 うまく追加できていると、ガジェット欄の左上に「hello world example」として、"Hello,world!"を表示しているガジェットが表示されていると思います。

 このように、GoogleガジェットはXMLによって定義され、インターネット上に公開されているXMLのアドレスをiGoogleに通知することで、iGoogle上でGoogleガジェットとして利用することができます。

XMLの記述方法

 先ほどのHello worldガジェットはシンプルな記述でしたが、一般的なガジェットはもう少し詳細な記述を行います。

 例えば、ガジェットの内容やスクリーンショット画像のURLを記述することで、ガジェット詳細のページにその内容を表示することができますし、作者の情報を記述することで、ガジェット開発者のページにその情報を表示することができます。これらのガジェットや作者に関する情報は、ModulePrefsタグの属性値として記述します。

 公開時に記述しておくと良い代表的な内容を以下に紹介します(図1)。

 このほかにもガジェットの高さや横幅を指定したり、ガジェットにスクロールバーを表示するかどうかを指定する属性があります。より詳しい定義は、ガジェットAPIのページで確認してみてください。

 ModulePrefsやContentsタグ以外に、Requireタグを書いてGoogleが提供するガジェットのAPIを利用したり、UserPrefタグを書いてユーザごとに情報を保存させることができます。この部分は、第4回のガジェットを実際に作るところで、もう少し詳しく解説します。

株式会社はてな
大手SIerを退職後、エンジニアリングディレクターとして2008年に株式会社はてなに入社。Mash up Award 2ndで「サグール賞」「きざし賞」「特別賞」、iGoogleガジェットコンテストで「特別賞」を受賞。http://d.hatena.ne.jp/chris4403/

Think ITメルマガ会員登録受付中

Think ITでは、技術情報が詰まったメールマガジン「Think IT Weekly」の配信サービスを提供しています。メルマガ会員登録を済ませれば、メルマガだけでなく、さまざまな限定特典を入手できるようになります。

Think ITメルマガ会員のサービス内容を見る

他にもこの記事が読まれています