特定サイトのrssを読み込ませて表示する ー jQuery編

サイトに特定サイトのRSSフィードを読み込みたいがあります。こういう場合は、「zRSSFeed」というjQueryプラグインを使用します。 zrssfeed_top

Initializing...
導入は簡単3ステップで完了します。

zRSSFeed本体をダウンロード

以下のダウンロードサイトより、最新版のファイル(zip)をダウンロードします。  RSS Feeds Reader Plugin for jQuery – Zazar Online Website Builder

執筆時点のバージョンは1.2.0で、こちらからダウンロードできます。

このファイルを解凍して出てきたファイルから、jquery.zrssfeed.min.jsというファイルを取り出し、ヘッダーに以下のとおりに記述を追加します。

header.phpに挿入

以下のコーディングをheader.phpの</head>より以前に挿入してください。

&lt;script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"&gt;&lt;/script&gt;
&lt;script type='text/javascript' src='js/jquery.zrssfeed.min.js'&gt;&lt;/script&gt;
&lt;script type="text/javascript"&gt;// &lt;![CDATA[ $(document).ready(function () { $('#test').rssfeed('http://example.com/feed/', { limit: 5,content: false }); }); // ]]&gt;
&lt;/script&gt;

※6行目に次項に示すパラメータを追加することにより、RSSFeedの形式を変更することができます。

挿入タグを記事に追加

読み込ませたいpost記事や固定ページの部分に以下のコーディングを追加してください。 挿入はビジュアル画面ではなく、テキストでおこなってください


&lt;div id="test"&gt;&lt;/div&gt;


※上記のdiv要素のid名testに挿入してます。#testは適宜修正して使ってください

サンプル

RSS Feed作成パラメータ

Parameter Default Description
limit 10 The number of feeds to return (maximum 100).
offset 1 The feed item number to start at.
header true If true, includes the header section containing the feed name and link.
titletag h4 Specifies the HTML tag for the feed title.
date true If true, includes the feed date section.
dateformat datetime The format of feed dates: ‘datetime’ – full date and time, ‘date’ – date only, ‘time’ – time only, ‘timeline’ – lasped time or a format mask (‘dd/MM/yyyy hh:mm:ss’).
content true If true, includes the feed description.
snippet true If true, shows a short description for the feed item, otherwise the full content is displayed.
media true If true, displays media items when available.
showerror true If true, and an error is returned from the Google Feeds API, the error message is shown.
errormsg Replaces the default friendly message when an error occurs.
key null Optionally use a Google API key.
ssl false Support for SSL. Set to True when using secure pages.
linktarget _self Specifies the target for all feed links (‘_blank’, ‘_self’, ‘_top’, framename).
linkredirect Specifies a page to redirect the feed links to. The original link is contained in the URL parameter named ‘link’.
linkcontent false If true, displays the content of the feed item as a link.
sort Sorts the feed items by either ‘title’ or ‘date’. Leave empty for no sorting.
sortasc true Specifies the sort direction, either ascending (true) or descending (false).
historical false If true, returns any additional historical records that may exist.

”This API is no longer available.”の表示について

2015年12月2日追記 このJqueryは、Google APIが削除されたことにより廃止となってしました。別の方法を検討するしかないようです。作者のページには以下の記載があります。

Due to the Google Feeds API being removed from service, which the plugin replied on, it will no longer be available or supported.

コメント

タイトルとURLをコピーしました