back
Google Feed API (6/8)
■フィードコントロールについて
ここまでの説明を読んで、Google Feed APIを使ってフィード情報を受け取り表示するのは、意外に面倒くさいもんだな、もっと簡単にぱぱっと表示したりできないんだろうか……なんて思った人。実は、あるんです。もっと簡単なものが。
Googleは、Feed APIの他に、APIを使って作成した、「完成した部品」も提供しています。「フィードコントロール」と呼ばれるもので、APIと同様にライブラリをロードして使います。こんとろーるといっても、ただタグを書くだけで動く、というわけではありません。やはり、簡単ですがスクリプトも書かなければいけません。ただし、その処理は以上に単純です。
では、下のリスト欄に簡単な利用例をあげておきましょう。ページにアクセスすると、Google Japan Blogと、Googleニュースの「Google」で検索した新着情報が表示されます。タイトルと日時、要約がまとめられ表示されるというシンプルなものですが、これがフィードコントロールのもっとも基本的な表示です。
では、スクリプトを見てみましょう。フィードコントロールも、Feed APIと同様、「load("feeds", "1");」でロードすることができます。Feed APIと同じライブラリに既に組み込み済みとなっているのですね。
ライブラリをロードしたら、まずはコントロールのオブジェクトを作成します。これは、google.feeds.FeedControlというものとして用意されています。
Googleは、Feed APIの他に、APIを使って作成した、「完成した部品」も提供しています。「フィードコントロール」と呼ばれるもので、APIと同様にライブラリをロードして使います。こんとろーるといっても、ただタグを書くだけで動く、というわけではありません。やはり、簡単ですがスクリプトも書かなければいけません。ただし、その処理は以上に単純です。
では、下のリスト欄に簡単な利用例をあげておきましょう。ページにアクセスすると、Google Japan Blogと、Googleニュースの「Google」で検索した新着情報が表示されます。タイトルと日時、要約がまとめられ表示されるというシンプルなものですが、これがフィードコントロールのもっとも基本的な表示です。
では、スクリプトを見てみましょう。フィードコントロールも、Feed APIと同様、「load("feeds", "1");」でロードすることができます。Feed APIと同じライブラリに既に組み込み済みとなっているのですね。
ライブラリをロードしたら、まずはコントロールのオブジェクトを作成します。これは、google.feeds.FeedControlというものとして用意されています。
var feedControl = new google.feeds.FeedControl();オブジェクトを作成したら、これに読み込むフィードのアドレスを追加していきます。これは「addFeed」というメソッドとして用意されています。フィードのアドレスとタイトルを引数に指定することで、そのフィードを読み込ませることができます。
feedControl.addFeed("http://feeds.feedburner.com/GoogleJapanBlog",
"Google Japan");
feedControl.addFeed("http://news.google.com/news?hl=ja&ned=us&ie=UTF-8&
oe=UTF-8&output=atom&q=Google", "Googleニュース");このaddFeedは、何度でも呼び出してフィードを追加することができます。ここでは２つだけ追加していますが、３つでも４つでもOKです。またここではGoogleニュースのフィードを追加していますが、これは以下のような形でアドレスにパラメータを用意しています。http://news.google.com/news?hl=言語&ned=国&ie=入力エンコード&まぁ、基本的に「q=」のテキスト部分だけを変更すれば、Googleニュースから検索したい内容だけをとり出し表示するためのフィードが得られる、と考えてよいでしょう。これは覚えておくと便利です。
oe=出力エンコード&output=出力データ形式&q=検索テキスト
feedControl.draw(document.getElementById("container"));最後に、フィードコントロールを指定のタグ内に組み込み表示します。引数には、コントロールを表示するタグのDOMオブジェクトを指定します。――全体の流れがわかれば、使うのはそう難しくはありませんね。なにより、手作業でフィードからエントリーをとり出し必要なデータを加工し……といった作業を行わないで済むのですから。(by. SYODA-Tuyano.)
※リストが表示されない場合
AddBlockなどの広告ブロックツールがONになっているとリストなどが表示されない場合があります。これらのツールをOFFにしてみてください。
※シンプルなフィードコントロール
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type"
content="text/html; charset=utf-8">
<title>Sample</title>
<style>
h1 {font-size: 14pt; font-weight:bold;
background-color:#DDF; padding:3px;}
</style>
<script src="http://www.google.com/jsapi"></script>
<script type="text/javascript">
google.load("feeds", "1",{"callback":OnLoad});
function OnLoad() {
var feedControl = new google.feeds.FeedControl();
feedControl.addFeed("http://feeds.feedburner.com/GoogleJapanBlog", "Google Japan");
feedControl.addFeed("http://news.google.com/news?hl=ja&ned=us&ie=UTF-8&oe=UTF-8&output=atom&q=Google", "Googleニュース");
feedControl.draw(document.getElementById("container"));
}
</script>
</head>
<body>
<h1>Google Feed API</h1>
<p>フィードコントロール</p>
<div id="container"></div>
</body>
</html>
| << 前へ | 次へ >> |