Google AJAX Feed APIを使ってシンプルなガジェット型RSSリーダーを作成する方法(Windows only)
スポンサード リンク
GoogleのAJAX系のAPI(Google AJAX Feed API, Google Maps API, Google AJAX Search API)は基本的にAPIキーが必要で、サイトに設置するときにAPIキーを設定していないと警告ダイアログが出てしまいます。しかし、ローカルで実行したときに限っては警告ダイアログは現れません。
そこで、Google AJAX Feed APIと、Windowsの「デスクトップにWebページを表示する機能」を利用して、デスクトップ上にシンプルなガジェット型RSSリーダーを設置してみます。
1. Google AJAX Feed APIでRSSを表示するページを作成
下記のサンプルコードは、「はてなブックマークの人気エントリー」と「livedoor クリップの人気ページ」を8件ずつ表示します。APIキーは正しいものでないと動作しないので、適当に取得してください。feed.Control.addFeedの引数を変えることで、お好みのRSSを表示させることができます。また、feedControl.addFeedは何個でも記述できます。
これを適当な場所にHTMLファイルとして保存してください。
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="content-type" content="text/html; charset=utf-8"/>
<title>Google AJAX Feed API - Simple Example</title>
<script type="text/javascript" src="http://www.google.com/jsapi?key=[APIキーは取得してね]"></script>
<script type="text/javascript">
google.load("feeds", "1");
function initialize() {
var feedControl = new google.feeds.FeedControl();
feedControl.addFeed("http://b.hatena.ne.jp/hotentry?mode=rss", "はてなブックマーク - 人気エントリー");
feedControl.addFeed("http://clip.livedoor.com/rss/hot", "livedoor クリップ - 人気ページ一覧");
/* 8件ずつ表示 */
feedControl.setNumEntries(8);
/* リンクを新規ブラウザで開く */
feedControl.setLinkTarget(google.feeds.LINK_TARGET_BLANK);
feedControl.draw(document.getElementById("feed"));
}
google.setOnLoadCallback(initialize);
</script>
<style type="text/css">
<!--
.gf-title {display:inline;} /* タイトルが改行されるようにinlineにする */
.gf-snippet {display:none;} /* 概要部分は隠す */
-->
</style>
</head>
<body>
<div id="feed" style="font-size:11px;width:100%;"></div>
</body>
</html>
2. デスクトップに表示
次に先ほど保存したファイルをデスクトップに表示させます。
↑[画面のプロパティ] - [デスクトップ] タブにある 「デスクトップのカスタマイズ」をクリック
↑[Web] のタブにある「新規」をクリック
↑「参照」をクリックして先ほど保存したファイルを選択
↑ファイルが追加されるので、あとは「OK」を押してプロパティを閉じます
↑すると、デスクトップにこいつが現れるので、マウスでサイズを調整してください
↑出来上がり
スタイルはCSSで自由にカスタマイズできます。エレメントのクラス名を調べたい場合はFirefoxのWeb Developer ToolbarやFirebugなどの拡張機能でインスペクトしてください。
同じようにすれば、デスクトップにGoogle Mapsを置いたり、Google AJAX Searchを置いたりすることもできます。
APIGoogle表示デスクトップfeedControlAJAXFeedgoogle
前のエントリー: « WindowsMode 2007年9月号にて「実践 Web API マッシュアップ」を執筆しました
次のエントリー: Popfly 先着5人まで招待します »
トラックバック
このエントリーのトラックバックURL:
この一覧は、次のエントリーを参照しています: Google AJAX Feed APIを使ってシンプルなガジェット型RSSリーダーを作成する方法(Windows only):
» RSSリーダーを簡単にHTMLアプリケーションでつくる32の方法 from ひろ式めもちょう
タイトルはバカっぽい感じにしてみただけです。 Google AJAX Feed APIを使ってシンプルなガジェット型RSSリーダーを作成する方法(Win... [詳しくはこちら]
» google ajax feed api その１ from 小樽ポータル管理人ｂｌｏｇ
google（グーグル）の新たなサービスgoogle ajax feed apiで小樽の関連ブログのrss速読みサイトを構築してみよう！
米Googleが... [詳しくはこちら]
» [Web2.0] プチDeskTop 2.0を実現しました！ from バキュラのように・・・
F.Ko-Jiさんブログを参考にいろいろとお気に入りのWeb 2.0部品を貼り付け、プチDeskTop 2.0を実現しました。(^o^)v まず、会社付... [詳しくはこちら]
このブログをRSSリーダーで簡単購読
タイトル:
URL:
リンク用HTMLタグ:
powered by Google Chart API
