RSS表示ブログパーツ(API)&jQueryプラグイン

jQuery plugin for fetching RSS

ブログのRSSフィードからブログ記事の目次を表示するブログパーツ(API)とjQueryプラグインを公開します。使用はもちろん無料です。
プラグイン内ではGoogle Feed APIを利用しています。jQueryプラグインはGPLライセンスです。いずれもSSL対応なので、httpsのサイトでもご利用いただけます。
PCではIE8~11・Firefox・Chrome・Safari、スマートフォンではiOSのSafari・Android標準ブラウザで動作確認済みです。

2015年10月15日に、ブログパーツとしてもリリースしましたので、一部追記しています。

利用方法1 RSS表示ブログパーツ

ブログやホームページににコードを貼るだけで、ブログの目次を表示できます
  • 下のエディターでRSS Feedアドレスなどを設定してください。
  • エディターの下にある「ブログパーツのコードを取得」ボタンをクリックしてコードをコピーしてください。
  • ブログやホームページなどで、ブログの目次を表示したい場所にコードを設置してください。
広告
Feedアドレス
表示数
高さ

日付表示
preview
    プレビューサイズ
    プレビュー背景色

    気に入っていただけましたら、このツールをどこかで紹介していただけますと嬉しいです。

    広告

    利用方法2 RSS表示jQueryプラグインPack

    RSSの中身を展開&表示するjQueryプラグインを手軽に利用できます

    2015年12月8日 Google Feed APIが終わってなかったようなので提供を再開しました。

    • エディターでRSS Feedアドレスなどを設定してください。
    • エディターの下にある「jQueryプラグインをダウンロード」ボタンをクリックしてzipファイルをダウンロードしてください。
    • zip内にあるreadme.txtを参考に設定し、サーバーに解凍したファイルをアップロードしてください。

    利用方法3 RSS表示jQueryプラグイン(手動設定用)

    jQueryプラグインのファイルをダウンロードし、カスタマイズして利用できます

    2015年12月8日 Google Feed APIが終わってなかったようなので提供を再開しました。

    mamewaza_blog
    Javascript・CSSのセット
    • 上のzipファイルをダウンロードしてください。
    • 以下のファイルが必須です。これらをアップロードしてください。
      mamewaza_blog.css
      mamewaza_blog.min.js
    • 天気予報を表示させたいページで、2でアップロードしたJavascriptを設置してください。 
      <script type="text/javascript" src="○○/mamewaza_blog.min.js"></script>
    • $.mamewaza_blogを以下のように実行してください。 
      $.mamewaza_blog( {
          selector: "ブログ目次を設置したい要素のセレクター",
          feed:"ブログFeedのアドレス",
          rpp:"表示件数(1~10)",
          height:高さ(100~600または"auto"),
          exp:本文表示有無(boolean),
          url:URL表示有無(boolean),
          date:日付表示タイプ(0:なし、1:「2015年1月31日」、2:「2015年1月31日 01:23:45」、3:「2015/1/31」、4:「2015/1/31 01:23:45」),
          cssPath:mamewaza_blog.cssへのパス
      } );
    • 出力されるHTMLは下記のようになるので、任意でデザインを適用してください。 
      <div id="mamewaza_blog" class="mamewaza_blog">
          <div>
              <h5 class="mamewaza_blog">
                  <a href="ブログURL" target="_blank">ブログタイトル</a>
              </h5>
              <ul class="mamewaza_blog">
                  <li>
                      <a href="記事のURL" target="_blank" class="mamewaza_blog_title">記事のタイトル</a>
                      <span class="mamewaza_blog_exp">記事の本文...</span>
                      <span class="mamewaza_blog_date">記事の投稿日</span>
                      <a href="記事のURL" target="_blank" class="mamewaza_blog_url">記事のURL</a>
                  </li>
              </ul>
              <div class="mamewaza_blog_exp" style="display:block !important;visibility:visible !important;position:static !important;">
                  <span class="memewaza_asscembled">
                      assembled by <a href="http://mamewaza.com/" target="_blank">まめわざ</a>
                  </span>
              </div>
          </div>
      </div>

    免責と注意事項

    • 本プログラムは、まめわざで作成したもので、商用・非商用を問わず無料でご利用いただけます(GPLライセンス)。
      ブログFeedのリクエストにはGoogle Feed APIを使用していますので、これらの規約に則ってご利用ください。
    • Google Feed APIが停止した場合は提供ができなくなります。
      また、Google Feed APIが仕様変更した場合は、プログラムが正しく動作しなくなることがありますので予めご了承願います。
    • 本プログラムは、くれぐれも自己責任でご利用をお願いいたします。
      本プログラムの利用によって生ずるいかなる損害に対しても一切責任を負いません。

    サポート掲示板

    不具合や不明点などがありましたら、こちらの掲示板をご利用ください。メールでの返信が必要な場合は、お問合せからご連絡ください。

    さん
    掲示板の主旨に反する投稿は掲載されません。掲載の是非は管理者が判断いたします。予めご了承願います。 投稿内容は掲載されますので、個人情報は一切投稿しないでください。