アメブロの新着記事をＨＰに掲載したい（広告非表示で）
一番いいのは、自分のサーバーにブログも組み込んでしまうことだけど、大人の事情でそうもいかない場合など
使用するのはコレ↓
RSS Feeds Reader Plugin for jQuery
ダウンロードして、HPの<head>に組み込みます
<script src=”js/jquery.zrssfeed.js” type=”text/javascript”></script>
とりあえず、日付とタイトルを取得
<script type=”text/javascript”>
$(document).ready(function () {
$(‘#ID名’).rssfeed(‘自分のRSS のURL’, { limit:6,header: false,titletag: ‘span’,date:’true’,content: false? });
});
</script>
で、
<body>の表示したい部分に、
<div id=”ID名”></div>
あとは、cssで好きなように形成（↓こんな感じ？）
#ID名{
clear:both;
width:575px;
overflow:hidden;
}
.rssBody ul li{
margin:5px 35px 10px 45px;
border-bottom: dotted 1px #ccc;
padding-bottom:10px;
padding-top:5px;
list-style:none;
overflow:hidden;
}
.rssRow div {
float:left;
margin-right:15px;
}
★この状態だと、アメブロの広告も取得しちゃいます★
で、本体を気持ち改造
予断ですが、個人的に、日付の表示を変更したかったので、
// Format published date の日付表示部分を変更
※2桁表示で、○○○○/○○/○○ としました
var pubDate = entryDate.toLocaleDateString() + ‘ ‘ + entryDate.toLocaleTimeString();
を
var Mon2 = entryDate.getMonth() + 1;
var Day2 = entryDate.getDate();
if(Mon2<10){ Mon2 = ‘0’+Mon2; }
if(Day2<10){ Day2 = ‘0’+Day2; }
var pubDate = entryDate.getFullYear() + ‘/’ +Mon2+ ‘/’ +Day2;
に変更
本題＠広告を表示させないために、// Add feed row のすぐ下に↓を挿入
if(entry.title.search(“PR:”) != 0){
// Alternate row classes のすぐ上に↓を挿入
}
広告表示についてる「PR:」がタイトルの一番最初にない時だけ、日付とタイトルを表示するように加筆しました
広告分、取得したデータのループが一回とんじゃうので、記事を5個取得したかったら、最初のjQueryの設定部分でlimit:6を指定してみました
広告が不確定な数字で出現するなら、ループの数字の取得方法を変更しなくちゃですねぇ
