Entry: main  << >>
ブログなどのRSSを読み込んで、サイトで表示する
ブログで書いた記事を、タイトル一覧のような形で、自分のサイトに表示できないか・・・?
という方法です。

こちらのサイトを参考にし、
使い勝手のよいように、多少手をくわえたものになります。
http://www.kawa.net/works/ajax/rss/rss-box.html

まず、
こちらから、「jkl-hina.js」「jkl-parsexml.js」をダウンロード。
こちらから、「jse-date-w3cdtf.js」をダウンロード。

読み込んで表示させたいページのhtmlファイルの同ディレクトリ内に置きます。

htmlファイルのHEAD内に、以下を記述。

<script type="text/javascript" src="jkl-hina.js" charset="Shift_JIS"></script>
<script type="text/javascript" src="jkl-parsexml.js"></script>

<script type="text/javascript" src="jse-date-w3cdtf.js"></script>

<script><!--
window.onload = function () {
var url = "読み込ませたいRSS";
var http = new JKL.ParseXML( url );
var func = function ( data ) {
var items = data["rdf:RDF"].item;

//表示する件数
if ( items.length > 15 ) items.length = 5;
var hina = new JKL.Hina( "rssbox" );

//日付表示
var items = data["rdf:RDF"].item;
for( var i=0; i<items.length; i++ ) {
var dd = new Date();
dd.setW3CDTF( items[i]["dc:date"] );
var min = ""+dd.getMinutes();
if ( min.length < 2 ) min = "0" + min;
var hour = ""+dd.getHours();
if ( hour.length < 2 ) hour = "0" + hour;
var date = dd.getFullYear() + "/" + (dd.getMonth()+1) + "/" +
dd.getDate() + " " + hour + ":" + min;
items[i]["dc:date"] = date;
}


var dest = hina.expand( data, "rssbox" );
dest.style.display = "";
};
http.async( func );
http.parse();
}
// --></script>

BODY部に、

<ul>
<li title="@foreach item1 [/rdf:RDF/item]"><a _href="[/item1/link]" style="color: #666666; text-decoration: none;">[/item1/title]</a> [/item1/dc:date]</li>
</ul>

と記述。

フリーのRSSリーダーだと、カスタマイズも出来ず、広告も入るので、
こちらのやり方がとても便利だと思います。
15:26 | comments(0) | - | - | -
Comment








Calendar

 123456
78910111213
14151617181920
21222324252627
28293031   
<< January 2018 >>

Recommend

Search

Entry

Comment

  • リンク元のページに戻るボタン(PHP)
    Tadashi (03/13)
  • サイト全体をメンテナンスページに切り替える単純な方法
    yo5kg (06/06)
  • 再配布不可識別子の入れ方
    jumbo (04/25)
  • Foma901シリーズ用 デコメテンプレートをPCで作成する方法
    ぐみ (12/11)
  • 再配布不可識別子の入れ方
    eguti (06/04)
  • ナビゲーションをul、liで作成する時
    ビジログ (03/09)
  • 再配布不可識別子の入れ方
    nana (02/02)
  • 再配布不可識別子の入れ方
    TOM (01/22)
  • Foma901シリーズ用 デコメテンプレートをPCで作成する方法
    pon (11/09)
  • Foma901シリーズ用 デコメテンプレートをPCで作成する方法
    pon (11/09)

Archives

Category

Link

Feed

Others

無料ブログ作成サービス JUGEM

Mobile

qrcode