Please Sign In or Register

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" を削除してトラックバックを送信してください。

コメント

drupal_add_js();

drupal_add_js(ファイルのパス);
で、スクリプトをロードできるみたいです。
それで、上手く機能するかは判りませんけど・・・。
興味があったらやってみてください。
上手くいけばテーマデザインに手を入れる必要はなくなります。
ブロックに<?php ~ ?>で直書きできてしまうのではないか?と。
不要になればブロックを無効にするだけでスクリプトはロードされなくなります。

ちなみにdrupal_add_cssにするとcssがロードされます。

これまた余談ですが、ワタシはfileshareというモジュールを使って、Drupalのfilesにフォルダを掘って、アップロードして、コンテンツや、ブロックから呼び出せるようにしています。モジュール情報ではCSSをロードさせています。
CSSに関してはCSSと言うモジュールがあって、5.xに移植されたらなぁ・・・と思っているのですが、その気配がありません・・・。CSSをDBに格納しちゃってノードで呼び出して使えるようにするモジュールなんですけど・・・。

今更なネタで申し訳ないですが

jstoolsの例のタブナビゲーションの一件の際に、あー!って、思っていたんだけど、書き込むチャンスを逸していたので、今更なんですが(^_^;)

drupal_set_html_head()というのはどうでしょう?
実はこれ、0829@drupal.orgさんに教えてもらったスクリプトをロードしている部分なんです。
ブラウザをチェックしてIEだったらIE用のcssを読み込ませるって言うコードを吐き出している部分ですが、これを使えばhttp://で始まるURLでもhead領域に潜り込ませることができそうな気がします。

あ、指摘していただいたのが0829@drupal.orgさんですから、実はもうお気づきかもしれませんが・・・。
お気づきの場合は流してくださいませ<(_ _)>

余談:ここでFirefox2にて、初めてログインで蹴られました(笑)
ロボフォームというパスワードマネージャーを使っているので、そのせいかもしれません。
また、Cookieも削除してみたので、Cookie絡みかもしれません。
でも、0829@drupal.orgさんはロボフォームはお使いではないでしょうから、Cookie絡みという方が可能性が高そうですね。

ありがとうございます。

あ、確かに使えそうですね。今度やってみます。
あの時は CSS に気をとられていて、こっちに応用するところまで気が回っていなかったです。ありがとうございます。
API についても書き残しておかないと、その都度、こうだったような…を繰り返していたのではなかなか前進しないですね。

Firefox 2.0 でログインできませんでしたか…
ロボフォームは使ってないですし、Cookie を削除してもログインできない時はできないんですよね。
リロードを繰り返したら表示されたり…セキュリティソフトなども何らかの影響を与えているのかもしれませんね。よくわかりませんけど。

セキュリティソフト

セキュリティソフトなども何らかの影響を与えているのかもしれませんね。

そうですね。否定はできませんね。
ちなみに、何が入ってますでしょうか?セキュリティソフト??
ワタシの職場のマシンはWinXP Pro + virus scan enterprise 8.0 と言う組み合わせでした。

設定はある程度変更していますが、

セキュリティソフトは CA インターネットセキュリティ スイート 2007 を使っています。
ある一定の条件が満たされた場合には必ずログインできないというのであれば何とかなりそうなのですが、ログインできたりできなかったりというのが気持ち悪いんですよね。

そうなんですよね

セキュリティソフトはウィルス絡みの機能以外はそれほど差はないとは思うのですが・・・。
もっと多くの事例が収集できればセキュリティソフトとの関係も条件として検討できるんですけどね。
実際問題として、確実に起こるという条件を割り出すことができれば楽ちんなんですけどね。
それができないところに、問題解決の難しさがありますよね。
ワタシの場合、Firefoxではまだ今のところ深刻な状況ではないのでいいのですが、IEの場合は結構深刻かもしれないですね。MSのサポートにあったような対策で打開できればいいんですけど・・・。

http:// で始まるパス

ブロックはエラーが起きるとサイトそのものが表示されなくなる(経験者です)ので、ちょっと試してないのですが、drupal_add_link , drupal_add_js , drupal_add_css って http:// で始まるパスも指定できるんでしょうか?
もしできるのなら、複数サイトのデザインを一度に変更できたりするのでかなり便利ですよね。

手を加える部分や加え方にはは好みの問題があるので何とも…ですが、個人的にはテーマファイルへの改変?が一番わかりやすくて簡単だと感じています。ローカルでできますし。

Google Analytics

Google Analyticsの例を見ると外部スクリプトを呼び出す部分は<head>~</head>じゃなくてもいいのかな?
って、考えるとブロックにHTMLをそのまま書いてしまっていいのではないでしょうか?

ちなみに、drupal_add_jsやdrupal_add_cssはURLの頭に’/’が付加されてしまうので、絶対URLの外部ファイルは呼び出せないようです。渡す文字列はそのまま利用しているようですからhttp://で始まっていても無関心のようですが・・・残念です。

ワタシはストーリーやページを投稿する要領で入力書式をphpコードにして、プレビュー表示で確認しています。この方法で確認しながら、ConTemplateをいじりました。
で、問題が起きなかったらブロックにすれば良いのではないかと。
でも、googleがわでエラー起こしていてロードできなかったらブロックがエラーになるのかな?
構文にさえエラーが起きなければ良いのであれば、HTMLでそのまま記述した方が安全と言えば安全かもしれませんね。HTMLなら読み込めなくてもブラウザが対応してくれるだろうし・・・。

余談:コードタグを使って<head>~</head>を囲んだのに、headタグが削除されてしまいました。正しい挙動なのでしょうけど・・・うーん。意味がない(T.T)BBcodeだったら、[notag]というタグを変換させないタグがあるんですけど・・・。

やっぱり http:// はダメでしたか…

Google Analyticsの例を見ると外部スクリプトを呼び出す部分は<head>~</head>じゃなくてもいいのかな?

表示されるかどうかという問題であれば、OK でしょうね。
これもまた、個人的な問題ですが、スタイルは css ファイル、Javascript は js ファイルとして別個に呼び出すという方が理にかなっているような気がするのと、できるだけローカルで作業したいということで…共有サーバですからね。

コードタグを使って<head>~</head>を囲んだのに、headタグが削除されてしまいました。...BBcodeだったら、[notag]というタグを変換させないタグがあるんですけど・・・。

<code>~</code> 内の < > が全て &lt; &gt; になってしまう方が困りませんか?コード内の特定の部分を <strong>~</strong> で強調したいとか、そういうことができた方が便利だと思うのですが…
WYSIWYG エディタでは、普通に文中に記述したタグは自動的に変換され、タグを使っていると意識せずに装飾や強調を行なった場合のタグはそのままタグとして残されますよね。だから WYSIWYG エディタが人気あるのでしょうね。

表現の仕方がよろしくなかったですね・・・

スミマセン。
表現の仕方がよろしくなかったですね。
htmlのタグを表示するんだったらbbcodeを使った方が楽だよね・・・と言うことです。
bbcodeにも[code]タグはあります。結局<code>タグに変換されるんですけどね。
HTMLタグを表現する場合にはHTML以外の入力書式が楽ちんだな・・・と言うことを言いたかったのですが・・・例えが悪かったんです。スミマセン。ちなみに、<code>タグで囲っても<head>は表示されないんですね・・・。

<が&lt;になったとしても、コピー&ペーストする分には問題にならないのでは?
コピペしてみましたけど、< >でペースとされたんだけど・・・。
おっしゃっている意味が違うのかな?bbcodeもフィルターを通した段階で&lt;に変換されますけど・・・そう言う意味じゃないのかな?

スミマセン。おっしゃっている意味が正しく理解できていません<(_ _)>

※ちなみに、codeタグを使っても変換されちゃいますね・・・バグ?ワタシの思い違い?

こんな感じです。

code タグを使う場合は < > は自分で &lt; &gt; と入力しないと上手くいきません。自動的に変換されたりはしないので…ですので、そのままコードをコピペなんてことも残念ながらできません。

<code>&lt;html&gt;</code> と入力すると、<HTML> と(やっと)表示されるという感じです。

<html>
  <head></head>
  <body></body>
</html>

のように、<body> 部分だけを強調したい場合に、以下のように入力して、全ての < > が &lt; &gt; に変換されると、意図しない結果になるので、「全て変換されると困りませんか?」と思ったんです。

<code>
<html>
  <head></head>
  <strong class="strong"><body></body></strong>
</html>
</code>

で、<body> 部分だけを強調したい場合には、こちらが正解になります。エディタで変換してからコピペしないと面倒ですが…(といいつつ、これらは全て手打ちなんですが。)

<code>
&lt;html&gt;
  &lt;head&gt;&lt;/head&gt;
  <strong class="strong">&lt;body&gt;&lt;/body&gt;</strong>
&lt;/html&gt;
</code>

慣れてしまっているから他の書式を覚えるよりこちらの方が早い気がしますが、いざとなったらやっぱり WYSIWYG エディタですね。

またしても色々と

またしても、色々とありがとうございます。
私が思い違いしていました。preタグと勘違いしていた様です。
どうもお騒がせいたしました。いつもいつもすみません。ありがとうございます。ホント0829@drupal.orgさんにはたくさん感謝してもしきれません。
bbcodeの場合は

<html>
  <head></head>
  [font=red]<body></body>[/font]
</html>

<>は自動変換されるようです。
ちなみに、codeタグを使っても、preタグを使ってもhtmlフィルタで削除されるのでcode、preタグの意味を成してないという気がしました。
構文を理解して削除しているんじゃないんですね・・・。ちょっと、安っぽさを感じました(T.T)

pre でも...

pre タグでも、スペースや改行が入力したとおりに表示される(code だと改行には br が必要で、複数スペースはスペース 1個分として表示される。)だけで、他の記号は変換されないはず...と思います。
わたしもいつも amayadori さんにはいろいろ勉強させていただいていますので、今後もよろしくお願いしますね。

コメントの表示オプション

お好みの表示方法を選択し、「設定の保存」をクリックすると、表示方法を変更することができます。