ブログを移転しました。
ご迷惑をお掛けしますが、ブックマーク等の変更をお願いします。

URL:http://ikubon.com/wp/
RSS:http://feeds2.feedburner.com/ikubon

タダ(無料)でどこまでできるのか、WindowsのMac化その他もろもろ
<< twittearthがきれすぎる | main | EMONSTER購入しました >>
Google Ajax Feed Apiを使ってAmazonの商品画像を表示してみる
| WEB2.0的生活 | 2008.04.24 Thursday | comments(1) | trackbacks(1) |

ブログのサイドカラムなどによくついている、Amazonの商品画像。どうやって表示させているのかよくわからなかったので、自分なりに考えてみました。

使った材料は、Google AJAX Feed APIとAmazonの新製品などを配信しているRSS。

まず、Google AJAX Feed APIのサイトより、設置したいサイトのURLを入力し、APIキーを発行

Google AJAX Feed API - Google Code

次にAmazonのベストセラー、ヒット商品のページからジャンルを選択し、RSS配信用のURLを取得

Amazon.co.jp ベストセラー

ブログのhead部(〜で囲まれている箇所)に以下のコードを貼り付ける

<script type="text/javascript" src="http://www.google.com/jsapi?key=<span style="color:#FF0000">ここにAPIキー</span>"></script>
<script type="text/javascript">
 google.load("feeds", "1");
  function initialize() {
   var feed = new google.feeds.Feed("ここにAmazonのRSS");
   feed.setNumEntries(5);
   feed.load(function(result) {
    if (!result.error) {
     var container = document.getElementById("feed");
     for (var i = 0; i < result.feed.entries.length; i++) {
      var entry = result.feed.entries[i];
      var gazo = entry.content.match("<img.*jpg.*?>")
       if(gazo != null){
        container.innerHTML += "<p><a href='" + entry.link + "'>" + gazo +"</a></p>"
       }
      var div = document.createElement("div");
      container.appendChild(div);
     }
    }
    });
   }
 google.setOnLoadCallback(initialize);
</script>

画像を表示したい箇所に次のコードを貼り付けるとできあがり。

<div id="feed"></div>

苦労してブログに貼り付けても、このままではアフィリエイトができません。AmazonRSSのURLの末尾にアソシエイトIDを追加してあげるとアフィリエイトができるようになります。 また、AmazonのRSSは1時間おきに更新され、更新されるとこちらの商品画像も自動的に置き換わります。

http://www.amazon.co.jp/rss/bestsellers/dvd/ref=pd_ts_rss_link?tag=ikubonnikki-22

Amazon RSSの詳しい設定についてはこちら。

Affi.IKUBON.com | Amazon RSS

できあがりはこんな感じです。

Amazon RSS 商品画像

コメント
はじめまして、この記事の通りやってみたらちゃんと成功したのですが、商品画像を横一列に並べ替えることは可能でしょうか?
| DMT_ICE | 2012/07/07 6:30 PM |
コメントする









この記事のトラックバックURL
http://blog.ikubon.com/trackback/820538
トラックバック
Amazonの画像加工(応用編3) AmazonのRSS取得と、画像表示を組み合わせる・2
DVDだけの Amazonの画像加工(応用編2) AmazonのRSS取得と、画像表示を組み合わせるにいろいろと手を加えて、本・DVD・おもちゃのBrowseNodeIdをベタ打ちし...
| PE2プレイ記録ほか | 2009/09/19 9:47 AM |

 RSSリーダーで購読する

CATEGORIES
Recent Comments
LINKS

あわせて読みたい

  • ブログSEO対策:track word

track feed

ARCHIVES
Related Posts with Thumbnails