複数のRSSを1つにまとめ、ソートして表示するサンプル
サイト上にRSSを表示する方法の一つとしてGoogle AJAX Feed APIは非常に簡単で便利ですが、複数のフィードを1つにまとめ、ソートして表示することはできません。
1つにまとめることはできるのですが、
- サイトAのフィード
- サイトAの4/9の記事
- サイトAの4/6の記事
- サイトAの4/3の記事
- サイトBのフィード
- サイトBの4/8の記事
- サイトBの4/5の記事
- サイトBの4/2の記事
- サイトCのフィード
- サイトCの4/7の記事
- サイトCの4/4の記事
- サイトCの4/1の記事
となるので、全てのフィードを合わせてのソートができません。
ということで
- サイトA・B・Cのフィード
- サイトAの4/9の記事
- サイトBの4/8の記事
- サイトCの4/7の記事
- サイトAの4/6の記事
- サイトBの4/5の記事
- サイトCの4/4の記事
- サイトAの4/3の記事
- サイトBの4/2の記事
- サイトCの4/1の記事
と表示させるプログラムを書きました。
デモ
サンプルは
の3種類のフィードから3件ずつ記事を取得し、日付で昇順ソートして表示。
- index.html
- GoogleAjaxFeedApi_maregAndSort_compression.js
- GoogleAjaxFeedApi_maregAndSort_override.js
の3ファイルから構成されており、全てutf-8。
index.html
サンプルということでbodyのonloadに動作のトリガを全て詰め込んでいます。
//インスタンス生成。引数としてインスタンス名を指定(eval用) o_feed=new GoogleAjaxFeedApi_maregAndSort_override('o_feed'); //ソートのキー //datetime、date、year、month、day、time、week、title、link、content、contentSnippet o_feed.set_sortKey('datetime'); //ソート形式(asc:昇順、desc:降順) o_feed.set_sortMode('desc'); //表示させるhtml要素のidを指定。サンプルでは<div id="feed"></div> o_feed.set_idView('feed'); //表示させるフィードを指定。引数は順にurl、表示記事数、フィードタイトル o_feed.add_feed('http://b.hatena.ne.jp/entrylist?mode=rss', 3, 'はてブ'); o_feed.add_feed('http://www.youtube.com/rss/global/our_blog.rss', 3, 'YOUTUBE新着'); o_feed.add_feed('http://www.amazon.co.jp/rss/bestsellers/books/492352/ref=pd_ts_rss_link', 3, 'amazon書籍best10'); //上記までが設定で、以下のbatch()で表示を行う o_feed.batch();
GoogleAjaxFeedApi_maregAndSort_compression.js
プログラムの本体です。
GoogleAjaxFeedApi_maregAndSort_override.js
表示用htmlソースを組み上げるメソッドだけを切り分けてあります。
オーバーライドできるようになっているので、表示させるサイトにあった形になるように修正してください。
以上、簡単ではありますが解説でした。
ご自由にお使いください。
ライセンスはMITです。