目次
概要
※本記事は「Google Feed API」の基礎的な部分の解説になります。複数RSSに対応する「Google Feed API」の使い方は、下記の記事を参考にどうぞ！ 簡単に外部RSSをサイトに表示できるGoogle Feed API【複数RSS対応編】RSSはatom・RSS1.0・RSS2.0など複数の形式があり、webサイトやブログ毎にバラバラです。これを取り込むには、phpならMagpieRSSやSimpleXML関数を使って整形するのが定番ですが、ある形式には対応していなかったり、ちょっとしたことでエラーが発生したり、簡単そうに見えて実はかなり大変です。
しかしこの「Google Feed API」を使えば、どの形式のRSSでも関係なく一括で整形してくれますので、スピードも軽いですし、これさえおぼえておけばもう悩む必要もなくなります。
基本形
<html>
<head>
<script type="text/javascript" src="https://www.google.com/jsapi"></script>
<script type="text/javascript">
google.load("feeds", "1");
function initialize() {
var feed = new google.feeds.Feed("【RSSのURL】");
feed.load(function(rss) {
if (!rss.error) {
// 【RSSの処理を記述】
}
});
}
google.setOnLoadCallback(initialize);
</script>
</head>
<body>
<div id="topics"></div> <!--【RSSを表示する箇所】-->
</body>
</html>
上記が「Google Feed API」を使う際の基本形になります。
【RSSのURL】の箇所にRSSのアドレスを追加します。RSSの中身がGoogleを通して、変数に格納されますので、【RSSの処理を記述】のところで、タイトルやテキストをhtmlの形に整形して、【RSSを表示する箇所】に出力するように記述します。
サンプル
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Google AJAX Feed API</title>
<meta name="keywords" content="Google,RSS,Feed,API" />
<meta name="description" content="Google AJAX Feed APIのサンプル" />
<script type="text/javascript" src="jquery-1.7.1.js"></script>
<script type="text/javascript" src="https://www.google.com/jsapi"></script>
<script type="text/javascript">
google.load("feeds", "1");
function initialize() {
// 読み込むRSSを設定
var feed = new google.feeds.Feed("https://news.7zz.jp/feed");
feed.load(function(rss) {
if (!rss.error) {
// 使用する変数を宣言
var channel = new Array();
var entry = new Array();
// RSSからサイトの情報を配列に格納
channel['title'] = rss.feed.title;
channel['link'] = rss.feed.link;
channel['favicon'] = "http://favicon.hatena.ne.jp/?url=" + channel['link'];
channel['description'] = rss.feed.description;
channel['author'] = rss.feed.author;
// RSSから記事の情報を配列に格納
for (var i=0; i<rss.feed.entries.length; i++){
entry[i] = {
title : rss.feed.entries[i].title,
link : rss.feed.entries[i].link,
content : rss.feed.entries[i].content,
contentSnippet : rss.feed.entries[i].contentSnippet,
publishedDate : rss.feed.entries[i].publishedDate
};
entry[i]['img'] = rss.feed.entries[i].content.match(/src="(.*?)"/igm);
for (var j=0; j<entry[i]['img'].length; j++){
entry[i]['img'][j] = entry[i]['img'][j].replace(/src=/ig, "");
entry[i]['img'][j] = entry[i]['img'][j].replace(/"/ig, "");
}
}
// 情報をhtmlに整形
var Feed = '<h2>n'
+ '<a href="' + channel['link'] + '">' + channel['title'] + '</a>n'
+ '</h2>n'
+ '<img width="195" src="' + entry[0]['img'][0] + '">'
+ '<h3>n'
+ '<img src="' + channel['favicon'] + '">n'
+ '<a href="'+ entry[0]['link'] + '">' + entry[0]['title'] + '</a>n'
+ '</h3>n'
+ '<p>' + entry[0]['contentSnippet'].substr(0, 100) + '……</p>nn';
// 表示するタグに追加
$('#topics').append( Feed );
}
});
}
google.setOnLoadCallback(initialize);
</script>
</head>
<body>
<h1>Google Feed APIのサンプル</h1>
<!-- RSSを表示するタグ -->
<div id="topics"></div>
</body>
</html>
サンプルの実行結果
ファイルのダウンロード[72KB]
ウェブソクのRSSを読み込んで、ブログのタイトル・リンク、最新の記事のタイトル・リンク・画像・テキストを表示するサンプルです。
RSSの整形と出力する部分が簡単になるので、jQueryを一緒に使っています。（49～62行目の記述が簡単になります。）jQueryの最新版は下記からダウンロードが可能です。
jQuery
また本文に含まれるimgを抽出して、最初の画像を表示するようにしています。（41～46行目）
関連ファイルを読み込み（7～8行目）
必要なファイルを読み込んでいます。整形と出力が簡単になるので、jQueryも一緒に使用しています。配列を宣言（21～22行目）
わかりやすいように、配列を使います。サイトのタイトルなど配列に格納（25～29行目）
rss.feed.title、rss.feed.linkというのは、RSSの内容がGoogleで抽出され、それぞれサイトタイトル、サイトURLを表しています。それらを使いやすいように配列に格納します。Googleで抽出された各情報は下記のようになります。「rss」の名前は任意で変更できます。
| プロパティ | 情報 |
|---|---|
| rss.feed.title | サイトのタイトル |
| rss.feed.link | サイトのURL |
| rss.feed.description | サイトの概要 |
| rss.feed.author | サイトのオーナー |
また記事の情報は、「rss.feed.entries[]」の配列に格納されており、記事の順番でrss.feed.entries[0]、rss.feed.entries[1]という形で格納されています。
例えば、最初の記事のタイトルは「rss.feed.entries[0].title」、2番目の記事のリンクは「rss.feed.entries[1].link」となります。
記事の情報をまとめると下記のようになります。
| プロパティ | 情報 |
|---|---|
| rss.feed.entries[…].title | 記事のタイトル |
| rss.feed.entries[…].link | 記事のURL |
| rss.feed.entries[…].content | 記事の内容 |
| rss.feed.entries[…].contentSnippet | 記事の概要 |
| rss.feed.entries[…].publishedDate | 記事の公開日時 |
| rss.feed.entries[…].categories[…] | 記事のカテゴリやタグ |
記事のタイトルなど配列に格納（32～47行目）
「rss.feed.entries.length」として、記事の数で繰り返し、記事毎に情報を配列に格納します。記事の内容や概要に画像が含まれていれば、そのアドレスを抽出するようにしています。表示用に情報をhtmlに整形（50～58行目）
表示したい場所に合わせて、配列に格納した情報をhtmlにします。表示用に情報をhtmlに整形（61行目）
「#topics」とは、下の「id=”topics”」を名前をつけたdivタグのことです。「.append」というのは、そのdivタグの中に「Feed」を追加するという意味です。複数記事に対応する場合
サンプル
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Google AJAX Feed API 複数記事の場合</title>
<meta name="keywords" content="Google,RSS,Feed,API" />
<meta name="description" content="Google AJAX Feed APIのサンプル" />
<script type="text/javascript" src="jquery-1.7.1.js"></script>
<script type="text/javascript" src="https://www.google.com/jsapi"></script>
<script type="text/javascript">
google.load("feeds", "1");
function initialize() {
// 読み込むRSSを設定
var feed = new google.feeds.Feed("https://news.7zz.jp/feed");
feed.setNumEntries(10);
feed.load(function(rss) {
if (!rss.error) {
// 使用する変数を宣言
var channel = new Array();
var entry = new Array();
var Feed = "";
// RSSからサイトの情報を配列に格納
channel['title'] = rss.feed.title;
channel['link'] = rss.feed.link;
channel['favicon'] = "http://favicon.hatena.ne.jp/?url=" + channel['link'];
channel['description'] = rss.feed.description;
channel['author'] = rss.feed.author;
// RSSから記事の情報を配列に格納
for (var i=0; i<rss.feed.entries.length; i++){
entry[i] = {
title : rss.feed.entries[i].title,
link : rss.feed.entries[i].link,
content : rss.feed.entries[i].content,
contentSnippet : rss.feed.entries[i].contentSnippet,
publishedDate : rss.feed.entries[i].publishedDate
};
entry[i]['img'] = rss.feed.entries[i].content.match(/src="(.*?)"/igm);
for (var j=0; j<entry[i]['img'].length; j++){
entry[i]['img'][j] = entry[i]['img'][j].replace(/src=/ig, "");
entry[i]['img'][j] = entry[i]['img'][j].replace(/"/ig, "");
}
// 記事をhtmlに整形
Feed += '<img width="195" src="' + entry[i]['img'][0] + '">'
+ '<h3>n'
+ '<img src="' + channel['favicon'] + '">n'
+ '<a href="'+ entry[i]['link'] + '">' + entry[i]['title'] + '</a>n'
+ '</h3>n'
+ '<p>' + entry[i]['contentSnippet'].substr(0, 100) + '……</p>nn';
}
// 最後にタイトルを追加
Feed = '<h2>n'
+ '<a href="' + channel['link'] + '">' + channel['title'] + '</a>n'
+ '</h2>n'
+ Feed;
// 表示するタグに追加
$('#topics').append( Feed );
}
});
}
google.setOnLoadCallback(initialize);
</script>
</head>
<body>
<h1>Google AJAX Feed API 複数記事の場合</h1>
<!-- RSSを表示するタグ -->
<div id="topics"></div>
</body>
</html>
サンプルの実行結果
複数記事を表示するには、34行目のfor文の内側に、記事をhtmlに整形する部分部分を入れれば良いかと思います。
おわりに あまりJavaScriptを知らない方でもわかるように書いてみましたがいかがでしょうか？細かいところまで全部わかっていなくても、なんとか使いこなせると思います。もしわからないところがあれば、コメントに書いて頂ければ、わかる範囲でお答えしますよー(ﾟ∀ﾟ)
RSSの情報から発言タイトルのみを一覧にして、記事へのリンクはなしにしたいと思っています。そのような場合、どのような記述がいいのでしょうか？ よろしくお願いします。
サンプルコードの49～58行目の「情報をhtmlに整形」の部分の位置を変えるといいと思います。
サンプルコード 32行目
for (var i=0; i<rss.feed.entries.length; i++){
【RSSから記事の情報を配列に格納】
【情報をhtmlに整形】←ここで整形
}
上記のfor文の中では順番に記事を取り込みますから、そのときにrss.feed.entries[i].titleをFeedに追加して、表示するタグを作れば良いと思います。
これでいかがでしょうか？
google.load(“feeds”, “1”);
function initialize() {
// 読み込むRSSを設定
var feed = new google.feeds.Feed(“http://news.7zz.jp/feed”);
feed.load(function(rss) {
if (!rss.error) {
// 使用する変数を宣言
var channel = new Array();
var entry = new Array();
// RSSからサイトの情報を配列に格納
channel[‘title’] = rss.feed.title;
// RSSから記事の情報を配列に格納
for (var i=0; i<rss.feed.entries.length; i++){
entry[i] = {
title : rss.feed.entries[i].title
};
}
// 情報をhtmlに整形
var Feed = 'n’
+ channel[‘title’] n’
+ ‘n’n’;
// 表示するタグに追加
$(‘#topics’).append( Feed );
}
});
}
google.setOnLoadCallback(initialize);
※サンプル
http://7zz.jp/work/sample/js/google_feed_api/simple_title.html
google.load(“feeds”, “1”);
function initialize() {
// 読み込むRSSを設定
var feed = new google.feeds.Feed(“ＲＳＳフィード”);
feed.load(function(rss) {
if (!rss.error) {
// 使用する変数を宣言
var entry = new Array();
var Feed = ‘
n’;
- ‘ + rss.feed.entries[i].title + ‘
n’;
nn’;// RSSから記事の情報を配列に格納
for (var i=0; i
// 情報をhtmlに整形
Feed += '
}
Feed += ‘
// 表示するタグに追加
$(‘#topics’).append( Feed );
}
});
}
google.setOnLoadCallback(initialize);
仕組みとしては理解できたと思うのですが、
サンプルのソースのRSSフィードのURLを変更すると、
中身が表示されなくなってしまいます。
文字コードはUTF-8で改行はLFになってるんですが、
ほかにどこがいけないのでしょうか？
jquery-1.7.1.jsを忘れてました。
これを同じフォルダに置いたら動作しました。
たいへん助かりました。ありがとうございます。
RSSフィードのタイトル配信数は、該当サイトに依存するのでしょうか？
エキサイトブログだと4つしか配信されないようなんですが、この数を増やすことはできないですよね？
表示件数の指定もできますよー
下記を追加するだけです。
feed.setNumEntries(表示させたい記事件数);
例えば10件なら、
var feed = new google.feeds.Feed(“http://news.7zz.jp/feed”);
feed.setNumEntries(10); ←【これ追加】
feed.load(function(rss) {
if (!rss.error) {
・・・・
・・
こんな感じで、loadする前にセットしてあげればokです。
ただRSSで表示されている記事数以上には表示されないので注意です。
※サンプル
http://7zz.jp/work/sample/js/google_feed_api/simple_title.html
こんな感じです。サンプル10件にしてみました。
いかがですか？
素早い返信、ありがとうございます。
追加行でOKでしたが、ブログを2つ表示させるうち、
ひとつは4つしか表示されなくて、もうひとつは10個出ました。
同じエキサイトブログなので、
もしかしたらブログの設定で変更できるのかもしれません。
これはブログの持ち主に確認してみます。
いずれにしても、
RSSのタイトルリンクのないものが欲しかったので、
たいへん助かりました。
ありがとうございます。
おっしゃるとおり、ブログの設定でRSSの記事件数を調整できる場合もありますので、確認した方がいいですね。
その後、同じサイトから複数の記事を表示させるための記述もコメントに見つけてチャレンジしたのですが、画像、タイトル、本文のレイアウトをそのまま複数表示させる場合、タイトルだけの複数表示とは記述が違っている部分があるので、良く分からずできませんでした。
もし、できたらタイトルだけでなく、最初のサンプルと同じように画像とタイトル、本文を複数表示させる記述方法を教えていただけませんでしょうか。
もうひとつ質問なのですが、このRSS Feedで表示されたサイトをiPhoneで見ると表示されません。iPadでは表示されるのですが、iPhoneで表示されない原因とか分かりますでしょうか。
他の方が書かれたGoogle Feed APIの記述方法でも同じようにiPhoneでは表示されませんでした。
■複数記事対応について
コードが長いので記事の方に、複数記事に対応した書き方を追記しておきましたので、参考にどうぞ。
変数に記事の内容を、どんどん追加していって、最後に表示するだけなので、内容は理解していただけると思います。
■iPhone表示について
あとiPhoneの表示についてですが、私の方ではサンプルは問題なく表示されています。
http://7zz.jp/work/sample/js/google_feed_api/disp_sample_iphone.png
もしかして、ブラウザの設定でJavaScriptが動かないように設定されていませんでしょうか。
iPhoneのSafariなら、「設定」→「Safari」で下の方に「JavaScript」のオンオフができる箇所がありますので、確認してみて下さい。
早速試してみます。
iPhoneのSafariはJavaScript オンにしてあるので、アップしているサイトがCMSのサイトなのでそっちに問題があるのかもしれません。調べてみます。
このようなサイトの運営は大変かと思われますが、とてもありがたいです。
サイトの方はCSSでカスタマイズして表示もまずまずうまく出来ました。
こちらのサイトの記述は他のGoogle Feed APIとは中身が違っていて、こちらのほうがカスタマイズしやすかったので利用させていただいております。
ところで、複数のブログから日付順に並べたいのですが、各ブログからは読み込み記事数も指定して表示するような記述方法がありますでしょうか。
他の方のコードの場合、表示させる部分でのカスタマイズがしにくくて、うまく出来ませんでした。
もし、出来る方法をお教えいただけたら有難いです。
よろしくお願いいたします。
他のサイトとやり方違うんですか！同じだと思っていました……
ご希望のカスタマイズは可能ですよ。
考え方としては、RSSのURLと表示したい記事数を配列にして、Feedとかの変数に全部取り込んで、最後に日時でソートかけて表示すればできあがりです。
また時間のある時にサンプル作ります。
ちょっと待ってていただいてもいいですか？
Google Feed AJAX APIの記述は設計する人によって癖があるのか、基本は同じようですが、微妙に違っていて別の人の記述から部分を流用みたいなことは基本がわかっていないと無理ですね。
急がなくても大丈夫です。ありがとございます。
うまく表示できたので、今はいろいろカスタマイズを試しています。
タイトルをトップに表示して、下の左に画像を配置し、右に本文というパターンと、画像を大きくして、画像の下にタイトル、本文を置くパターンなど試しています。
本当は画像も縦横比の違っている画像も統一して表示できる「MyThumbnail」（http://www.kfsoft.info/MyThumbnail/demo.php）というjQueryも導入してみたいのですが、このAPIの表示画像に適応させる方法について理解できていません。
複数のブログからのFeed表示と縦横比の違う画像も綺麗に並べられたら嬉しいです。
ついでにもう一つ質問なのですが、Feedで読み込んで表示させる時に、一番最初の記事（最新の記事）だけを除いて2番目移行の記事の数を指定して表示させることとかもできるのでしょうか。
いろいろ質問してしまって申し訳ございません。
これが出来ればかなり手の込んだ表示も可能になると思うのでぜひ実現できればと思っています。
よろしくお願いいたします。
楽しみに待っております。
よろしくお願いいたします。
概ねサンプルはできているのですが、うまく動かないところがありまして現在修正中です。
今受けている仕事と、このブログの更新で手がいっぱいですので、また暇な時期になったら手直しいたしますので、気長にお待ちいただければ幸いです。申し訳ありません。
気長に待ちます。
でも、必ずお願いします。
期待しています！
また、複数のRSSに対応したサンプルも楽しみにしています！ついでに２４時間以内にアップされた記事についてはnew!が表示されるとかだと嬉しいですｗ（願望）
複数RSSに対応した記事を書きました！
簡単に外部RSSをサイトに表示できるGoogle Feed API【複数RSS対応編】
http://news.7zz.jp/ajax/2447.html
なるべくシンプルに書きました。
各RSSから取り込む記事数や、最終的に表示したい記事数も調整できます。
長らくお待たせしてすみませんでした。m(__)m
早速試してみます！
後日、報告させて頂きます！
お役に立てれば幸いです。
このサイトの「簡単に外部RSSをサイトに表示できるGoogle Feed API【基本編】」のスクリプトは、非常に役に立ち、大変!大変感謝しております！
自分のサイトでは「複数記事に対応する場合」のスクリプト元に16行目のvar～をコメントアウトしてそこに以下のスクリプトを追加することにより複数サイトからのRSS読み込みを実現しました。（文法的に会っているのか判りませんが…動いております。ちなみに他の方が公開しているスクリプトの動きそうなものをコピペしただけです）
var feedurl = new Array(“サイトAのURL”,”サイトBのURL”); //RSSのURL
for (n = 0; n < feedurl.length;n++ ) {
var feed = new google.feeds.Feed(feedurl[n]);
この基本編のスクリプトの場合、同じサイトの複数個所に設置しても動きました！（もちろんJSを外部ファイルにし、それぞれIDを変えました）
残念ながら新しい「簡単に外部RSSをサイトに表示できるGoogle Feed API【複数RSS対応編】」の方は、同じサイトの複数個所にはIDを変えてもうまく動きません（１か所に集約される）でした。（なんとなくやってみただけなので、もしかしたら私のミスかもしれません！）
でも、基本編のほうが動くので無問題です！
ただ、一つだけご質問なのですが…（質問と言うかほとんど依頼です。スイマセン！）
「RSSを配信しているサイトの過去記事（最新ではなく）をランダムに拾ってくる」ことは可能でしょうか？
例えばx日（←xは指定できる）前よりも前のエントリーをランダムに拾ってくる。ない場合は拾わないとか…
自分でも調べつつやってみようかと思いましたが…基礎が判っていないのでそこからやり始めております。なのでいつになるか…
もしお時間の都合がよろしければ、ヒント等を与えていただければ幸いです。
それでは、失礼いたします。
過去記事に関しては、取得先のサイトがどこまでの記事をRSS配信しているかによって、取得できるかどうかが決まります。
通常はブログの設定で「RSS配信は10記事分」などに限定して設定します。この場合は最新から10記事までしか表に出ていませんので、その10記事分しかRSSを取得できません。
仮に過去記事全てのRSSを取得できたとしても、１度過去記事を全て読み込んで、それをランダムにピックアップして、表示するという手順になりますので、結構処理が重くなりそうです。
ですので、あまりオススメはできないのですが、いかがでしょうか。
ご回答…本当にありがとうございます！
確かにRSSって普通制限ありますよね。それがすっかり頭から消えておりました…しかもそれ全部って大変処理が重くなりそう…
でも、逆にスッキリしました！
本来の私の目的は「現在の最新記事をx個取得して表示するコードとは別にそれ以外の記事を取得して表示させたい」ということでしたので…単純に今のコードにx個前の記事から記事をx個取得すればいいのか！とモヤモヤしてたものが晴れた気分になりました！
もちろんxは大きくするにも限界があるし、重くなるしでやりすぎは注意ですが、１サイトから取ってくるRSSて１・２個程度ですから…まずは自分でやってみます！
最後に人さまのサイトにて思いつきノート的なコメント…大変申し訳ありません。
gaito777様のお陰で本当にたすかりました。ありがとうございました。
触ってみたら段々わかってくると思うので、挑戦してみて下さい。
さっそく使ってみたのですが、日付を表示させようと
+ ” + entry[0][‘publishedDate’] + ‘n’
を追加してみたら、実際表示されたのが
Sat, 05 Jan 2013 07:12:45 -0800
となりました
これを「2013年1月5日」と表示させるにはどうしたらよいのでしょうか？
それとは別にwordpressのRSSを取得しようとすると何も表示されないのですが何が原因なのでしょうか？
サイトの問題かと思い、wordpress3.5を新規インストール、プラグイン無しの状態でRSSを取得してみても駄目でした
■日付について
日付の変換は下記と同じですので、参考にしてください。
簡単に外部RSSをサイトに表示できるGoogle Feed API【複数RSS対応編】
http://news.7zz.jp/ajax/2447.html
■WordPressのRSSについて
状況がわからないので、指摘できる原因が多すぎますね。
新規のWordPressって記事がない状態でRSSって出力してますか？
なにも表示されないってことなので、JavaScriptのエラーのような気がしますねー
WordPressのRSSは表示されているのか？
JavaScriptの変数は全て宣言されているか？
など、処理する順番で、一つ一つ切り分けて原因を探るといいですよ。
日付の変換なんとか出来ました！ ありがとうございます
wordpressのRSS取得なのですが、原因がよく分かりません…orz
http://babel-gaou.sakura.ne.jp/blogtest/
テスト用に新規インストールしてプラグイン無し・テスト投稿をした状態です、wordpress本体プラグイン最新です
このアドレスのRSSを取得する場合
http://babel-gaou.sakura.ne.jp/blogtest/?feed=rss2
上記アドレスで表示できるはずだと思うのですが、何も表示されない状態になってしまいます
解決方法を教えて頂けると嬉しいです、よろしくお願い致します
日付はうまくいったようで良かったですね。
WordPressのテストサイトを見させていただきましたが、
RSSの出力は問題はなさそうですね。
これで「何も表示されない」となると、
多分読み込む側のJavaScriptの問題でしょう。
読み込む際に、主にタイトルと本文は読み込んでいることと思いますが、
タイトルすら表示されず、完全に真っ白な状態でしたら、
おそらくエラーでしょう。
JavaScriptなどの読み込む側を、
再度細かくチェックしてはいかがでしょうか。
こちらのページで配布されているGoogle AJAX Feed APIのサンプルのZIPファイルをDLし、RSS取得アドレスを
http://babel-gaou.sakura.ne.jp/blogtest/?feed=rss2
にしても何も表示されなく
for (var j=0; j<entry[i]['img'].length; j++){
entry[i]['img'][j] = entry[i]['img'][j].replace(/src=/ig, "");
entry[i]['img'][j] = entry[i]['img'][j].replace(/"/ig, "");
}
この部分を削ると画像は表示されませんが、他の部分は表示されました
ここで問題が起こっているのだと思うのですが、JavaScriptが分からないので手詰まりになってしまいました
この部分の修正方法を教えて頂けませんでしょうか、お願い致します
43～46行目のimgに関する部分です
あくまでもサンプルですので、全てのRSSに合わないと思って下さいね。
読み込みたいRSSに合わせて、各自でカスタマイズをお願いします。
その部分は単純にimgタグ内のurlを取得しているだけなので、
そんなに難しくないですよ。
おそらくRSS内に画像が無いのに、urlを取得しようとしてエラーが出ているのかな？
簡単に外部RSSをサイトに表示できるGoogle Feed API【複数RSS対応編】
http://news.7zz.jp/ajax/2447.html
こちらの同じ部分を見て下さい。
imgタグがなかったら、その部分を飛ばすようにしています。
少しJavaScript勉強しておくと、いろいろ応用が効くので、
おすすめですよ。
JavaScriptの情報はいくらでも出てきますので、
がんばって勉強してみて下さい。
お手数おかけして申し訳ありませんでした
本当にありがとうございます！
うまく行って良かったです。
最近良く見かけるあんてなサイトを自分用に作りたいなーと思っていたところ、こちらを参考に無事作ることができました。
めちゃくちゃ分かりやすかったです。ありがとうございます。
http://heboantenna.at-ninja.jp
おお〜それはなによりでした！使い方がうまく伝わって良かったです。
ブログのＪＰＧだけ表示させたい場合、どのようにしたらいいか、アドバイスお願いします。
単純にimgタグを抜き出して出力すればいいのではないでしょうか？
大きさを調整したいのなら、画像のurlを抜き出して、htmlに整形する時に任意でwidthとheightを決めて、imgタグにしてあげればいいと思います。
の意味を少しアドバイスお願いします。ココログのＲＳＳを取ってきているのですが、文章の絵文字（ＧＩＦ）をとってきてしまい、肝心の投稿写真が表示されないです。よろしくお願いします。
例えば本文に含まれている画像のurlを、絵文字を除外して、全て配列に格納して表示するとかでしょうか。
あとは絵文字の除外する条件を見つければ良いと思います。
例えば、urlの中にドメインが共通しているとか、フォルダを使っているとか、最悪gifを全部除外する、などでいけると思います。
画像と画像下にタイトルで
こちらのサイトの合わせて読みたい関連記事のような
横４，５列表示には出来るのでしょうか？
不躾な質問で申し訳ありませんが
宜しくお願い致します。
もちろん可能です。
最後にタグを出力すると思いますが、
それをスタイルシートで整えます。
自分の好きな形になるように、タグを増減させて、
それをスタイルシートを使って形を整えればokです。