Google AJAX Feed API でブログの人気エントリーを表示するサンプル
スポンサード リンク
Google からまた新しいAPIがリリースされました。今回は、指定したフィードを取得してJSONやXML形式で結果を返してくれる、 Google AJAX Feed API です。
Google AJAX Search API Blog: Announcing the Google AJAX Feed API
対象がフィードのみなので、 Google AJAX Search API よりもシンプルです。
早速サイトにあったサンプルコードを参考にして、このブログの人気エントリーを表示するサンプルを作成してみました。
ソースは以下のようになっています。
<!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 でブログの人気エントリーを表示するサンプル</title>
<script type="text/javascript" src="http://www.google.com/jsapi?key=ABQIAAAAsLXCLqvsRiiJaBCS-_mMcRTJHeJbbL2-eEcwuol3A-ymf21LmBSnUkKoAtst8QPp2Oi9KJYLcbZVew"></script>
<script type="text/javascript">
google.load("feeds", "1");
function initialize() {
var feed = new google.feeds.Feed("http://b.hatena.ne.jp/entrylist?mode=rss&url=http%3A%2F%2Fblog.fkoji.com%2F&sort=count&threshold=5&include_news=1");
feed.setNumEntries(15);
feed.load(function(result) {
if (!result.error) {
var container = document.getElementById("feed");
for (var i = 0; i < result.feed.entries.length; i++) {
var entry = result.feed.entries[i];
var div = document.createElement("div");
var a = document.createElement("a");
a.href = entry.link;
a.appendChild(document.createTextNode(entry.title));
div.appendChild(a);
var img = document.createElement("img");
img.src = "http://b.hatena.ne.jp/entry/image/" + entry.link;
with(img.style) {
verticalAlign = "middle";
marginLeft = "4px";
}
div.appendChild(img);
container.appendChild(div);
}
}
});
}
google.setOnLoadCallback(initialize);
</script>
</head>
<body>
<div id="feed"></div>
</body>
</html>
詳しいリファレンスは以下のページにあります。
Google AJAX Feed API - Class Reference
APIGooglefeedvardivAJAXFeedimg
前のエントリー: « SuicaもPASMOも“数センチ浮かせて1秒静止”がポイント
次のエントリー: 無料で使える7つのSEOツール »
トラックバック
このエントリーのトラックバックURL:
この一覧は、次のエントリーを参照しています: Google AJAX Feed API でブログの人気エントリーを表示するサンプル:
» 早速Google AJAX Feed APIを導入してみました from [Z]ZAPAブロ〜グ2.0
Googleから「Google AJAX Feed API」が公開されました。
このAPIは、他ドメインのRSSやAtomの一般的なフィードを簡単に取得... [詳しくはこちら]
» Google AJAX Feed API の AJAX SlideShow を使ってみよう from F.Ko-Jiの「一秒後は未来」
Google AJAX Feed API - AJAX SlideShowではGoogle AJAX Feed APIを利用したスライドショーのライブラリ... [詳しくはこちら]
» Google AJAX Feed API で RSSテイッカー作った from PHPとAjaxと
以前に、他サイトのRSS情報を取得して、ティッカー風に表示するツールを 作成した... [詳しくはこちら]
» レビューポスターを使ってMovabaletypeで人気エントリー表示 from WEBデザイン BLOG
サイドフィード株式会社が提供するサービス”レビューポスター”を使って、Movabletypeに人気エントリー表示するようにしました。他にもjavascri... [詳しくはこちら]
» ブログのサイドバーに自分のはてなブックマークのRSSフィードを表示する from コハリトりみっと
はてなブックマークウィジェットは、ブログに任意のサイトの注目エントリーを貼り付けられるウィジェットですが、私がしたいのは注目エントリではなく、「自分のブ... [詳しくはこちら]
» ブログのPVを増やすための4つの手軽でシンプルな方法 from WEBマーケティング ブログ
ブログのページビューを上げるには、おもしろいネタを探して記事に起こしたり、時事... [詳しくはこちら]
このブログをRSSリーダーで簡単購読
タイトル:
URL:
リンク用HTMLタグ:
powered by Google Chart API
