2006年4月25日

Amazonの商品画像へのリンク作成用 Bookmarklet

 画像へのリンクを簡単につくってくれるBookmarklet(Javascriptのワンポイント・アプリ。お気に入りにいれてつかえる)がほしいなと思って、さがしてみたところ、徒波さんのところでよさそうなものをみつけました。

 うーん、でも、うごいてくれない。
 タイトル文字にリンクをつけてくれる「テキストリンク」は出力されるリンクがちょっとおかしいもののうごくのですが、「画像へのリンク」はまったくうごいてくれません。

 どうやらIE6のBookmarkletには文字数制限があるらしく508文字以内だということ。うーんでも、508文字以内だと思うけどな、と悩みましたが、文字をいくつか削ってみると、あれ、うごく。やっぱり文字数制限にひっかかっているようです。

 さらjに調べていくと、文字数制限をかわす方法がみつかりました。
川o・-・)<2nd life - bookmarkletの文字数制限を無くす
 「createElementでscript要素を作って、その中にソースを指定」する方法です。外部スクリプトの呼び出しで文字数制限を回避するというわけです。
 リンク先ではサーバー上に置いていましたが、ローカルに置くこともできます。たとえば、"http://example.com/example.js"となっているところを"file:///C:/Program%20Files/Fenrir%20%26%20Co/Sleipnir/bookmarklet/example.js"のように書き換えます。

 さっそく変更。それと、商品ページへのリンクがうまくできない場合への対応と、プロンプトでアドレスを返してくるのではなく、クリップボードにアドレスを送るようにしました。

Bookmarklet: A-Img(alt)改


javascript:
var aid='451f-22';
var altimg='http://shimakuma.com/archives/images/noimage.gif';var t=document.title;
var u=document.location.href;
var i=u.search('ail\/-\/|\/ASIN\/|oduct\/|..\/dp\/');
var asin=u.substring(i+6,i+16);
var imglink='<a href="http://www.amazon.co.jp/exec/obidos/ASIN/'+asin+'/'+aid+'/ref=nosim" title="'+t+'"><img src="http://images-jp.amazon.com/images/P/'+asin+'.09.MZZZZZZZ.jpg" alt="'+t+'" onload="if(this.width==\'1\') this.src=(\''+altimg+'\')" /></a>';
clipboardData.setData('text',imglink);
 赤い太文字で示した2行目のaidは自分のアソシエイトIDに変えてください。その下は商品画像がなかった場合に表示する画像のリンクです。自分で用意した画像のリンクに書き換えてください。

 表示例
Amazon.co.jp:新ゲノム 1 メガストアコミックス: 本 Amazon.co.jp:ゲノム 4 (4)カラフルコミックス: 本


変更点
(2006/7/11) 個別商品ページのURLの表記法が変わっていたのでちょっと変更。青い部分をつけくわえました。

(2006/8/31) さらに変更。の部分を追加。URLからASINの部分を切り取っているだけです。ASINの直前の文字列を指定しています。

(2007/1/6) リンクにしているブックマークレットが、エディタに貼って保存すると空白部分が文字化けしてしまうのを修正しました。空白文字や&lt;などは、&nbsp;や&lt;と書き換えないとリンクとしてうまく認識してくれないんだけど、この空白の&nbsp;がくせ者のようです。&nbsp;ではなく&#32;のほうを使うと大丈夫なようなので、そちらに変更しました。

コメントする