PR

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のWebサイトにログインすることでさまざまな限定特典を入手できるようになります。

Think IT会員サービスの概要とメリットをチェック

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