Google AJAX Feed API
Google AJAX Feed API が公開され、実装を試みているサイトをいくつか発見したので、それらを参考に 0829.info サイトのフロントページ下部に、このサイトの RSS Feed を表示するコンテンツブロックとして導入してみた。
Google AJAX Feed API で API Key を取得すると、RSS Feed を表示するための HTML ファイルのサンプルコードが表示されるので、それに少し手を加えただけだ。
1. サンプルを元にした JavaScript ファイルを作成
以下の内容を gfeedapi.js として作成し、Drupal サイト内の適当な場所にアップロードする。
サンプルからの変更箇所を強調。
google.load("feeds", "1");
function initialize() {
var feed = new google.feeds.Feed("http://drupal.0829.info/rss.xml");
feed.setNumEntries(10);
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");
div.innerHTML = '<a href="' + entry.link + '">' + entry.title + '</a>';
container.appendChild(div);
}
}
});
}
google.setOnLoadCallback(initialize);2. テーマファイルからのスクリプトの呼び出し
使用するテーマファイルの page.tpl.php の <head>～</head> 部分に以下の 2行を追記する。
強調部分は環境に応じて変更。
<script type="text/javascript" src="http://www.google.com/jsapi?key=YOUR_KEY_HERE"></script>
<script type="text/javascript" src="gfeedapi.js ファイルのパス"></script>3. ブロックの作成
以下の内容を表示するブロックを新しく作成し、表示する。 » ブロックの追加
<div id="feed"></div>実際には、div 要素が空になるのを防ぐため、以下のようなブロックを作成している。
<div id="feed"><strong>= Drupal.0829.info's RSS Feed =</strong></div>
[参考]
Google AJAX Feed API
【ハウツー】Googleからの新たな贈り物、「Google AJAX Feed API」を試そう | エンタープライズ | マイコミジャーナル
Web2.0の星: Google AJAX Feed APIの使い方
トラックバック
トラックバックは承認後に表示されます。
URLから "-nospam" を削除してトラックバックを送信してください。