ホーム 製品情報  Bookmark 出張ポータル CONTACTS SITE MAP      
 

  

ホーム
上へ
Google Gadget置き場

 

  関連Blogサイト

WEB2.0とパソコン講座
 








 


Sponsored Links
 










Counter


Google ガジェット


Sponsored Links


<まえがき>
Googleのガジェットは色々な場所に設置することが可能です。
HTML文を覚えていなくても、構造さえ理解していれば、簡単に自分のWebサイトにも
貼付可能ですので試してみて下さい。
 



--- 目 次 ---
1.Google ガジェットの種類と入手方法
  1) Google DeskTopのサイドバーやDeskTop
  
2)パーソナライズドホームページ(iGoogle)
  
3)自分のWebサイトやブログ

2.iGoogle ガジェットの公開方法と作成

3.Googleガジェットを「Windows Vista」のサイドバーで使う

4.簡単にマッシュアップを作成できるエディタ「Google Mashup Editor」



1.Google ガジェットの種類と入手方法


 
 Googleの場合は、3タイプの場所に設置可能です。
 

  1) Google DeskTopのサイドバーやDeskTop
       設定方法
            
Google DeskTopをダウンロードして、インストールする。
       ②お好みのガジェットを追加する。



  
2)パーソナライズドホームページiGoogle)
    設定方法
      
①グーグルのアカウントを取得 する        --> アカウント取得は、こちらから。
      ②パーソナライズドホームページの設定 -->  設定方法は
こちらを参照。
      ③お好みのガジェットを追加する。



  
3)自分のWebサイトやブログ
      設定方法
        
   ①ウェブページ用 Google ガジェットのサイトでお好みのガジェットを選択。
     ②貼付方は簡単です。ウエブページ用Googleガジェットのページで好みのガジェット
      を選択して、「自分のWEBページに追加」のボタンを押す。
     ③表示方法の詳細を指定するページが表示されますので設定後、「コードを取得」の
               ボタンを押すとjavaスクリプトのソースが表示されます。
     ④これをCOPYして、自分のWebサイトやブログに貼り付けるだけです。

    ガジェットのHP掲載のサンプルは
こちらから どうぞ。


 

2.iGoogle ガジェットの公開方法と作成


 自作の「ガジェット」を利用する為には、ガジェットを定義するXMLファイルを公開しなければなりません。
オープンソースをホスティングするための場所が必要になります。自前でサーバーを立てている場合は必要ないでしょうが、通常は何処かのスペースを借ります。もちろんGoogleでも無料で借りれます。

現在、iGoogleのガジェットコンテストが開始されています。 作成だけでなく、アイディアの登録も実施されています。


注意事項

上記の方法で公開すると、ガジェットを非公開にすることはできません。 ガジェットをパブリックな公開ウェブサイトに公開すると、誰でも見つけて表示できます。 電話番号や個人のメール アドレスなど、個人を特定する情報を含めないよう、くれぐれも気をつけてください。



公開場所と公開方法

Google Code Project Hosting
Google Page Creator

ここでは②の方法で公開します。
Google のアカウントを既に取得していることを前提にしています。
Google アカウントを取得すると、便利なツールが多数利用できますので、 まだ取得されていない方は、こちらのページから無料で取得できます。


例題>

<?xml version="1.0" encoding="UTF-8" ?>
<Module>
  <ModulePrefs title="Hello World!" />
  <Content type="html">
    <![CDATA[
         Hello World!
    ]]>

  </Content>
</Module>



1)上記の XML ファイルを作成して、ディスクトップにでも保存します。(ファイル名.xml)

2)
Google Page Creatorを使って iGoogle ガジェットを登録します。  (http://pages.google.com/)
  自分のPCで作成した XML ファイルを Google Page Creator にアップロードする。
 



アカウントを取得後、ページクリエーターにログインすると上記画面が出ますので、画面右下の「Upload Stuff」 の「Upload」をクリックするとCopyもと場所を指定できて、アップロードできます。

3) 自分で作成したガジェットをiGoogleで表示する場合は、「コンテンツを追加」で「URLを指定して追加」を押すとURL入力画面が表示されます。


登録したgoogle ガジェットのアドレス
http://ユーザアカウント.googlepages.com/ファイル名.xml  と URL を入力すると読み込まれます。

これで、表示されればOKです。

ガジェットの作成(コーディング)に関しては、それぞれ自分で勝手に「学習」してコーディングして下さい。

下記のGoogleのサイトにサンプルや作成方法が、日本語で詳しく記載されています。
http://www.google.com/apis/gadgets/gs.html

Sponsored Links


 

3.Googleガジェットを「Windows Vista」のサイドバーで使う


iGoogleに使うGoogleガジェットについては、上記の記事で紹介したが、これがWindows Vistaのサイドバーでも利用できる方法があります(Macでも利用可能)。

変換ソフトを使しますが、「
Amnesty(TM) Generator for Vista」というソフト。
http://www.amnestywidgets.com/GeneratorWin.html

1)上記のサイトより、ダウンロードしてインストールです。

2)Amnesty Generatorを起動したら、表示パネルの[Open Site in Browser]ボタンを押す。


3)「webページ用Googleガジェット」のページが表示されるので、お好みのものを選び、[自分のウェブページに追加]ボタンを押す。



4)表示方法の詳細を指定するページが表示されますので設定後、「コードを取得」のボタンを押すとjavaスクリプトのソースが表示されます。 このコードを全部選択し、右クリックメニューでコピーを選ぶ。



5)「Amnesty Generator」画面に戻り、Step 2 の下欄に先にコピーしたコードを貼りつけ、パネル下の[Generate]ボタンを押す。これで変換が完了。


6)Vistaのサイドバーの追加パネルに変換したGoogleガジェットが入っているので、ダブルクリックでサイドバーに追加すればOKです。




 

4.簡単にマッシュアップを作成できるエディタ「Google Mashup Editor」


 Googleは、簡単にマッシュアップを作成できるエディタ「Google Mashup Editor」をリリースしました。
現在のところ限られた開発者のみに公開されている。

Google Mashup EditorはGWT(Google Web Toolkit)を使って構築されている。
そして、それ自身がAjaxで動作するWebベースのエディタです。
HTML、JavaScript、CSS、XMLを記述することができ、デバッグ機能も備えている。

早速、使用してみました。

自分のアカウントで、ログインしないと使用できません。
http://editor.googlemashups.com/editor




サンプルコードも色々ありますね。
RSSのフィードを表示するサンプルで、配信先のURLをエディターで変更して、表示テストした画像です。
作成したマッシュアップアプリケーションは「iGoogle」のガジェット等に配置可能です。

ちょっと、遊ぶ程度でしたら、このサンプルで十分です。  皆さんも、試してみてください。


Copyright (C) 2002
IT活用支援塾
最終更新日 : 2013/08/11