複数のRSSフィードをまとめて昇降順に表示する方法。ファビコンもつけますよ。

今回紹介する、複数のRSSフィードをまとめて表示する方法は、miha5のコピペ用ですので、詳しく説明していません。
というか、詳しく説明できません(JavaScriptとかよくわかんない)。
使うのは、Google Feed APIっていうのです。

ということで、自分でコピペして使う用ですが、必要な方はどうぞコピペして使ってください。

複数のRSSフィードをまとめて昇降順に表示する方法。

今回紹介するのは、次のサイトのRSSフィードを読み込むようになっています。

ほかにも、表示させる件数とかカンタンに弄れるところは、コメントアウトしてるのを参考に弄ってみてください。
基本的には、コピペで大丈夫です。

<script type="text/javascript" src="https://www.google.com/jsapi"></script>
<script type="text/javascript">
google.load("feeds", "1");
//<![CDATA[
var getRssFeeds = function (_id, _urls, _maxLength) {
    if(!_id || !_urls || (!(_urls instanceof Array)))   return;
    var entryNum = 10;//各RSSの読み込みエントリー数
    var maxLength = (_maxLength)?   _maxLength : 0 ;
    //総エントリー表示数(0はすべて表示)
    //変数定義
    var entriesArray = new Array();
    var complete = 0;
   
    //初期化
    var init = function () {
        for(var i=0 ; i < _urls.length ; i++){
            //RSS読み込み
            var feed = new google.feeds.Feed(_urls[i]);
            feed.setNumEntries(entryNum);
            feed.load(function(result) {
                if (!result.error) {
                    for (var i = 0; i < result.feed.entries.length; i++) {
                        var entry = result.feed.entries[i];
                        entriesArray.push(entry);
                        var pdate = new Date(entry.publishedDate);
                        var arr = entriesArray[(entriesArray.length-1)];
                        arr.sortDate = pdate.getTime();
                        arr.siteTitle = result.feed.title;
                        arr.siteUrl = result.feed.link;
                    }
                }
                complete++;
                if(_urls.length == complete)    echo();
            });
        }
    };
    //表示
    var echo = function () {
        entriesArray.sort (function (b1, b2) { return b1.sortDate < b2.sortDate ? 1 : -1; } );//降順にソート
        //this.entriesArray.sort (function (b1, b2) { return b1.sortDate > b2.sortDate ? 1 : -1; } );//昇順にソート
        var feedLength = (_maxLength)? _maxLength : entriesArray.length;
        var container = document.getElementById(_id);
        var html='<dl>';
        for (var i = 0; i < feedLength; i++) {
            var entry = entriesArray[i];
            var pdate = new Date(entry.publishedDate);
            var Y = pdate.getFullYear();
            var m = pdate.getMonth() + 1;
            m = (m < 10)? "0" + m:m;//月数字を2桁で表示
            var d = pdate.getDate();
            d = (d < 10)? "0" + d:d;//日数字を2桁で表示
            var date = Y + "年" + m + "月" + d + "日";
           
            html += '<li>';
            html += '<img src="http://favicon.st-hatena.com/?url=' +entry.siteUrl + '" />';
            html += ' <a href="' + entry.link + '" target="_blank">' + entry.title + '</a>(' + date + ')';
        }
        html += '</dl>';
        container.innerHTML += html;
    };
   
    google.setOnLoadCallback(init);
};


getRssFeeds("feeds", [
    "http://feeds.gizmodo.jp/rss/gizmodo/index.xml",
    "http://feed.rssad.jp/rss/gigazine/rss_2.0",
    "http://feed.rssad.jp/rss/engadget/rss",
    "http://getnews.jp/feed",
    "http://feeds.rocketnews24.com/rocketnews24",
    "http://miha5.com/feed"
]);

//]]>
</script>

↑これをhead内にコピペします。
そして、↓これをbody内にコピペすると、各サイトのRSSフィードが表示されます。

<div id="feeds"></div>

このコードだとこんな風に表示されるよっていうサンプル

こんなカンジに表示されます。
あとは、CSSで自由に弄ってください。
コピペはどんどんどうぞ。

デモ:複数RSSフィードをまとめて昇降順に表示する

シェアありがとうございます

  • このエントリーをはてなブックマークに追加
  • Pocket
  • LINEで送る

commentsComment

  1. […] 参考サイト②:複数のRSSフィードをまとめて昇降順に表示する方法。ファビコンもつけますよ。 Check […]

commentYour Message

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です

checkboxみはら.comはエックスサーバーです

editNEW エントリー

PAGE TOP arrowup