sbで行こう


ENTRY

[tips] Amazon の商品画像入れ替え:sb 1.21R 以降対応版

本サイトは、BlogPeople PEOPLESerene Bach に住まう人々に登録しています。

少し前の話になりますが、sb 開発研究所にて sb 1.21R がリリースされました。このリリースでは、『オススメ商品』メニューで利用する Amazon Web Service (AWS) API が、ECS 3.0 から 4.0 へアップグレードされています。これは、Amazon が 2008 年 3 月末日をもって ECS 3.0 のサービス提供を終了するための措置であり、2008 年 5 月現在、既に 1.21R にバージョンアップをしていない sb ではオススメアイテムの検索ができなくなっています。

これにより、sb の『オススメ商品』メニューには以下のような影響が出ています。

  1. Amazon に商品画像が登録されていない商品は、商品画像の部分が代替テキストで表示される
  2. オススメアイテムを登録した後で Amazon に商品画像が登録されても、オススメアイテムの商品画像は入れ替わらない

上記の問題は ECS 3.0 を使っているバージョンでも既に発生していたのですが、その時は Amazon 側の動作が仕様として確定していないことを理由に対応しませんでした。しかし、ECS 4.0 になったことで Amazon 側の動作も確定したので、あらためて本問題に対応する JavaScript を考えました。

なお、このスクリプトは上記の 1 番目の問題にのみ対応しています。2 番目の件については、今のところは商品画像が登録されたタイミングで再登録することになります。

このスクリプトは、オススメアイテムに該当するクラス名が付与された <img> タグに Amazon から発行された画像アドレスが入っていない(空の)場合に、画像アドレスを『No Image』用の画像に置き換えます。なお、1px × 1px の透明 GIF 画像が表示されるアイテムの画像入れ替えにも対応しているので、以前の JavaScript をお使いの場合はこちらと入れ替えてください。

まず、以下のようなスクリプトファイルを作成します。

amazon.js:
function amazonNoImg(imgSrc) {
    var imgs = this.document.images;
    for (var i = 0; i < imgs.length; i++) {
        if (imgs[i].src.match (/¥bamazon¥b/)) {
            if (imgs[i].width == 1 && imgs[i].height == 1) {
                imgs[i].src = imgSrc;
            }
        } else if (imgs[i].className == 'amazon_pict') {
            imgs[i].src = imgSrc;
        }
    }
}
amazonNoImg('画像アドレス');

画像アドレスにはご自分の好きな『No Image』用画像のアドレスを入れます。なお、アドレスの指定は http で始まる URI 指定にした方がトラブルの心配をしなくてすみます。また、画像アドレスをシングルクオート(')で囲むのを忘れないで下さい。

また、amazon_pict は、{amazon_item} 独自タグを利用してオススメアイテムを表示した場合に、商品画像の <img> タグに付与されるクラス名です。テンプレートでオススメアイテムの表示をカスタマイズしている等、<img> タグに付与されるクラス名が違う場合には、この部分を該当するクラス名に変更してください。

こうしてできた amazon.js をサーバの好きなところにアップロードします。これは sb のファイルアップロードメニューではなく、FTP 等のアップロードツールで行って下さい。

アップロードした後は、テンプレートの </body> タグの前あたりに以下のスクリプトを記述します。

<script type="text/javascript" src="amazon.js のアドレス"></script>

amazon.js のアドレスも URI で表記した方がトラブル予防になるでしょう。

コメント(日付順)

コメントする
  • 投稿を受け付けるには、JavaScript を有効にしてください。
  • URI は自動リンクされます。
  • HTMLタグは使えません(実体参照化されます)。