SEMTechnologyExtraInformationRecommend週間ブックマークカテゴリーなしIntroduce200904/27「複数RSSまとめ&タブ化ジェネレーター」、公開します!この記事の読了時間:約5分30秒ツイート複数のRSSフィードをひとつのタブにまとめて読み込み、そんなタブを最大5つまで表示させるスクリプトジェネレーター、作っちゃいました!その名も「複数RSSまとめ&タブ化ジェネレーター」!!Yes!そのまんま!Yes!!タブに表示させたいタイトルと、それぞれのタブで読み込みたいRSSフィードのURLを入力するだけで、いともたやすくスクリプトが生成されます。あとはそのスクリプトを自分のサイトに貼っ付けるだけ。どなたでも簡単に実装できます。使用無料のMIT-lisenceなフリーウェア!今回のエントリーは、smkn渾身のWEBサービス「複数RSSまとめ&タブ化ジェネレーター」のご紹介です!「複数RSSまとめ&タブ化ジェネレーター」についてまずはどんなモンが生成されるのか、以下のサンプルをご覧ください。サンプルページ上記サンプルページのようなものを実装するために必要なマークアップ(xhtml)~スクリプト(Javascript)を生成します。生成されるスクリプト以外に必要なもの(各種JSライブラリやcssなど)は、「必須データ詰め合わせ.zip」として一括ダウンロードできます。́)」を使用しています。以下より、この「複数RSSまとめ&タブ化ジェネレーター」で生成されるスクリプトの詳細な使用法です。API」を利用しています。API」の利用には登録申請が必要なので、まずはこの登録申請を行い、APIのキーを取得します。API」キーを取得する方法。事前にGoogleアカウントでGoogleにログインしておいてください。利用規約に同意のうえ、使用するサイトのURLを登録してください。APIキーが生成されます。上記手順でAPIキーを入手したら、次項に進みます。2.「必須データ詰め合わせ」のダウンロード。タブ回りのJavaScriptやCSS、画像データなんかをzipでまとめましたので、これをダウンロードします。imgの各フォルダ+template.htmlが同梱されています。template.htmlでは、あらかじめ各JavaScriptやcssへのリンクパスを合わせていますので、ジェネレーターで生成されたスクリプトをtemplate.htmlのbodyの内側に貼り付ければ、まず問題なく動作すると思います。既存のサイトに導入する場合は、各フォルダの中身をお持ちのサイトの適切なフォルダに移動させたのち、CSS内の画像リンクパスを修正して利用してください。※imgフォルダ内の画像(タブに使用しています)は、cssで設定しています。Template.zipとフォルダ構成が違う場合は、css内のimgへのパスを書き換えてください。必須データ詰め合わせ.zip次はいよいよスクリプトの生成です!3.「複数RSSまとめ&タブ化ジェネレーター」ページでスクリプトを生成する。「複数RSSまとめ&タブ化ジェネレーター」ページに飛び、各フォームにタブのタイトルやRSSフィードなどを入力していきます。RSSフィードのURLは、1URLごとに改行してくだしあ。タブは最大5つまで生成可能です。読み込むRSSのURLやフィードの数に関してですが、1タブにつき「読み込むフィードURLの数×取得する記事数」が50以内、っていう規制を設けました。あと、タブの名前を長くし過ぎると、ちょっと不恰好になるかもです。ITキヲスクのRSSがタブ1か2に必ず読み込まれる仕様となっておりますが、こちらは当ブログの宣伝的なモノと捉えていただければと思います。いわゆる下心です♪どーしても気に食わない・要らないよーって場合は、削除しちゃっても構いません。_)mそんなこんなで生成したら、そのスクリプトを使用するサイトの<body></body>の中にぶっ込んでください。タブの大きさや文字サイズなんかは、「必須データ詰め合わせ.zip」の中にあるcssをサイトに合わせて修正してください。以上、smkn初のWEBサービス「複数RSSまとめ&タブ化ジェネレーター」のご紹介でした。最後に、ご利用に関しての注意事項&お願いを。フィードタイトルだけでも著作物です。当ジェネレーターで生成されるタブには、各フィードのタイトルだけが表示されます。タイトルだけとはいえ、それでも立派な著作物です。ご利用には配信者への敬意と配慮をお忘れなく。不具合やバグがあったら教えてください。分かる人が見れば一発だと思うんですが、綺麗にまとまった流暢なスクリプトではありません。エレガンスの対極にあるような。検証を行い動作確認はしっかりやっていますが、不具合やバグがあるかもしれません。改善策や問題点などありましたら、ぜひご教示ください。ご利用は自己責任でお願いします。「複数RSSまとめ&タブ化ジェネレーター」で生成されるスクリプトは、MIT-lisenceで提供しています(MITに関しての解説エントリーはコチラ)。改変も商用利用も問題ありませんが、ご利用は自己責任の上でお願い致します。コメントとかブクマとかしてくれたら嬉しくて泣きます。面白がって楽しんで頂ければと思っています。さーて、次はどんなの作ろーかなー。PMはじめまして検索エンジンで偶然、知りました。利用させていただきたいと思います。target=”_blank”にしたいのですが、その方法をご教授いただけないでしょうか。当方、超々シロートです。”</a>”;」という部分があるかと思います。”</a>”;」と書き換えてください。”</a>”;」に書き換えてください。3タブ以上ある場合も、同様の記述部分を書き換えれば、ご要望どおりの挙動になるかと思います。ちなみに、上記は全て全角で記述しちゃってますので、実際に書き換えるときは必ず半角に直してくださいね☆(空白スペースも半角で記述してください。)見辛くてスミマセン。これでうまく設置できたら良いのですが...。AM早速の対応ありがとうございました。無事、設置することができました。今、作成中の新サイトで使わしていただきます。お手数をおかけしました。APIは便利だけど、デフォルトじゃ物足りないし、自分でスクリプトを作成する技術も無いので、ブラブラと探索していましたら、こちらにたどり着く事が出来ました。ITキヨスクさんが作成されたタブメニューは理想のタブメニューでして一方的ですが、ぜひ利用させて頂きたいと思います。それから、あつかましい要望なんですが、表示されたRSSの先頭か末端に、日付の取得は出来ないのでしょうか?出来るので有ればご指導お願い出来ないでしょうか?宜しくお願いいたします。AM>ぽこサマソレ、いただきっ!というコトで、早速ジェネレーターの方で「日付け取得しますか?」という項目を新設しちゃいました!選択制にしてあるので、必要ならつけられるようにしてありますよー。AMこちらこそ、要望搭載ありがとうございました。これからもご活躍期待しております。何度も申し訳ありません。日付の取得うまく行きましたありがとうございます。ご指導お願いしたく投稿させて頂きました。ブロック幅が少ないのでどうしても日付の折り返しがでて、見苦しいのでタグで段落を起こそうと思ったのですが、上手く行きませんでしたので、日付のみ段落させる方法等有りましたらご指導願えませんでしょうか?宜しくお願い致します。addDate;という部分があるかと思います。そこの”</a>”の部分を”</a><br>”に変更してください。2つ目以降もタブがある場合は、同じような部分をそれぞれ同様に修正すれば、全部改行されると思います。PM>ITキヨスクさんありがとうございます。頼り過ぎですが、勉強しながら頑張って完成させようと思います。この度はありがとうございました。PMはじめましてでぶしつけですがすみません、タブの中にテキストを入れたいんですがどのようにしたらいいでしょうか。教えて下さい、お願い致します。AM>keyさんいえいえ、お構いなくー☆さて本題ですが、正直この「複数RSSまとめ&タブ化ジェネレーター」では難しそうです。いうのも、コレは単純に「RSSを読み込んで吐き出す」というだけのモノなので、読み込んだRSSフィードの1つ1つに対してアレコレするって前提ではない仕組みになっちゃってるんです。出来ないことは無いんですが、すごく管理が面倒になって汎用性に欠けちゃうのです。PMいえいえ、こちらこそ丁寧なご回答ありがとうございました。すごく軽くてソースも分かりやすく最高です!ありがとうございます。_)mさっそく本題なんですが、調べてみたところ不可能ではないみたいなんですが、ちょっと実現は難しいかもです。いうのも、「ジェネレーター」という仕組み上、元々があんまり汎用性に欠ける作りになっちゃってて、機能追加するのがかなり難しいシステムなんです。こんなコトなら最初からもっと考えて作るべきだったなーと後悔しきりなんですが。いうワケで、申し訳ありませんです。ありがとうございます。サンこちらこそ、見つけていただきありがとーございます!「登録日時」の件ですが、各ブログ単位でしたら日付け順になるんですが、フィード単位だとちょっと難しそうです。ホームページ熟読して、早速やってみます。日付順だと最高なんですけどね...グーグルリーダーのサイトクリップみたいな感じですかね。使ってみますありがとうございました。AMありがとうございました。表示は素敵です!新しいニュースが下の方へいってしまうのが残念でなりませんが...ありがとうございました。利用させていただいています。PMお早い返答ありがとうございます。さんいえいえこちらこそー!画像の抽出はAPIの仕様的に出来ないっぽいですねー。PMまさに探し続けていたものなので本当に感動です!どうして誰も作らないのかってずっと思ってました!!使わせて頂きます。ありがとうございます。