PE2HO

Betelgeuse's Diary

スポンサーサイト

上記の広告は1ヶ月以上更新のないブログに表示されています。
新しい記事を書く事で広告が消せます。

ブログ記事内からJavaScriptでTwitterのRSSを取得し、表示する(Google Ajax Feeds API利用)

試しに The 3rd Birthday公式Twitterを表示してみます。
twitpicのサムネイル表示(以下)や
http://twitpic.com/show/mini/2c4i5e
http://twitpic.com/show/thumb/2c4i5e
http://twitpic.com/show/large/2c4i5e
日付の日本時間化などは入れていない最低限の表示方法です。






ブログ記事内からJavaScriptでAmazonのRSSを取得し、表示する(Google Ajax Feeds API利用)
Amazonの画像加工(応用編3) AmazonのRSS取得と、画像表示を組み合わせる・2
ブログ記事内からニコニコ動画の公開RSSを取得し表示する(Google Ajax Feeds API利用)
【激重注意】ニコニコ動画の公開RSSをすべて表示するテスト
などと同じです。

1. 以下のソースをコピペ
2. Googleにログインした状態で、自サイト/ブログのURLでキーをもらう
3. key= 以降を差し替え
4. fc2ブログならば「改行の扱い 」を「HTMLタグのみ」にチェック
5. 動くはず
6. カスタマイズ用の資料:クラス リファレンス - Google AJAX Feed API - Google Code

<script type="text/javascript" src="http://www.google.com/jsapi?key=【キーを入れてください】"></script>

<script type="text/javascript">
google.load("feeds", "1");
function initialize() {
    var rss_url="http://twitter.com/statuses/user_timeline/168611679.rss"; 
    var feed = new google.feeds.Feed(rss_url);   
    feed.setNumEntries(20);
    document.getElementById("feed").innerHTML="Loading....";
    feed.load(function(result) {
        if (!result.error) {
            var container = document.getElementById("feed");
            container.innerHTML="";
            for (var i = 0; i <result.feed.entries.length; i++) {
                var entry = result.feed.entries[i];

                var div = document.createElement("div");
                var hr = document.createElement("hr");
                var br = document.createElement("br");
 
                var elem = document.createElement("a");
                var str = document.createTextNode( entry.publishedDate);
                elem.href = entry.link;
                elem.appendChild(str);

                div.innerHTML=entry.content;
                div.appendChild(br);
                div.appendChild(elem);

                container.appendChild(div);
                container.appendChild(hr);

            }
        } 
    });
}
google.setOnLoadCallback(initialize);
</script>
<div id="feed"></div>
関連記事
スポンサーサイト

テーマ:Twitter - ジャンル:コンピュータ



コメント

コメントの投稿


管理者にだけ表示を許可する

トラックバック

トラックバックURLはこちら
http://parasiteeve2.blog65.fc2.com/tb.php/554-06f2c304
この記事にトラックバックする(FC2ブログユーザー)

FC2Ad

上記広告は1ヶ月以上更新のないブログに表示されています。新しい記事を書くことで広告を消せます。