右クリックで「A8.NET経由楽天市場・画像付き」

☆

注意: この記事で紹介しているスクリプトを使用するときは、必ずご自分のアフィリエイトID(a8mat番号)に書き換えてから使ってください。そのまま使うのはやめてください。よろしくお願いします。 (2008年4月28日追記)

A8.NET経由でのアフィリエイトリンク生成を支援するスクリプトの第2弾です。

マウスで選択中の画像の URL を JavaScript で取得する方法がわからず、 結局、html ソース中の画像URLを順番にサーチしていって、 いちばん最後に見つかった jpeg 画像を暫定的に目的の画像だと判断するようにしてみました。 妥協というやつです。同一ページで扱っている商品が複数ある場合は期待していない画像が選ばれてしまう可能性が高いですが、 生成された html ソースを手で直してください (^^;

例によって、設置の仕方は、他の MenuExt を参考にしてください。以下に示すスクリプトは EUC-JP で保存して使ってください。

それでは、ソース、行きます。

注意: この記事で紹介しているスクリプトを使用するときは、必ずご自分のアフィリエイトID(a8mat番号)に書き換えてから使ってください。そのまま使うのはやめてください。よろしくお願いします。 (2008年4月28日追記)

<META HTTP-EQUIV="Content-Type" CONTENT="text/html; charset=EUC_JP">
<META HTTP-EQUIV="Content-Script-Type" CONTENT="text/javascript">
<SCRIPT language="JavaScript" type="text/javascript">
// 右クリックで「A8.NET経由で楽天のアフィリエイトのリンク」を作成する
// Copyleft 2004 by H.Tsujimura (tsupo@na.rim.or.jp)
// Ver 1.0  19 Sep 2004  最初の公開バージョン
// 注意: A8.NET経由の場合、楽天本体、楽天ブックス、楽天トラベル(旅の窓口)はそれぞれ別途、契約をする必要があります。
//       このスクリプトがサポートするのは、楽天本体(楽天市場)のアフィリエイトリンクに限ります。
//       A8.NET経由で楽天ブックスにアフィリエイトリンクを貼りたい場合は、
//         “右クリックで「A8.NET経由で楽天ブックスのアフィリエイトのリンク」を作成する”
//             (http://watcher.moe-nifty.com/memo/2004/09/a8net.html)
//       スクリプトを使ってください。楽天トラベル用のスクリプトは、まだ作成していません。

function translateString(str) {
    result = "";
    len    = str.length;
    for ( i = 0; i < len; i++ ) {
        if ( str.charAt(i) == '?' )
	    result += "%3F";
        else if ( str.charAt(i) == '>' )
	    result += "%3E";
        else if ( str.charAt(i) == '=' )
	    result += "%3D";
        else if ( str.charAt(i) == '<' )
	    result += "%3C";
        else if ( str.charAt(i) == ':' )
	    result += "%3A";
        else if ( str.charAt(i) == '/' )
	    result += "%2F";
        else if ( str.charAt(i) == '&' )
	    result += "%26";
        else if ( str.charAt(i) == '%' )
	    result += "%25";
        else if ( str.charAt(i) == '#' )
	    result += "%23";
        else if ( str.charAt(i) == ' ' )
	    result += "&nbsp;";
        else if ( str.charAt(i) == '\n' )
	    result += '<br />';
        else
	    result += str.charAt(i);
    }

    return ( result );
}

obj = external.menuArguments;   // 右クリック時の引数オブジェクト
page_url  = obj.document.URL;   // いま見ているサイト(ページ)のURL
title_txt = obj.document.title; // いま見ているサイト(ページ)のタイトル
str = obj.document.selection.createRange().text;  // 選択されている文字列
/*
img = obj.document.selection.createRange().images;  // 選択されている画像 ← こんな機能はない!!
*/
str2 = obj.document.body;
inn  = str2.innerHTML;
img  = obj.document.images;
num  = img.length;

// ↓↓ 自分のa8mat番号に書き換えてください
var a8mat = "X6H6X+6S3XSY+5WS+BWXXD";
// ↑↑ 自分のa8mat番号に書き換えてください

/*
 * 生成例 (http://www.a8.net/a8v2/rakuten/g-top.jsp を使用)
 *   <a href="http://px.a8.net/svt/ejp?a8mat=O6H6A+6S3QSY+5WS+BWVTD&a8ejpredirect=http%3A%2F%2Fwww.rakuten.co.jp%2Fedigi%2F802797%2F813693%2F" target="_blank">
 *   <img border="0" alt="Click Here!" src="http://image.www.rakuten.co.jp/edigi/img10011630153.jpeg"></a>
 *   <img border="0" width="1" height="1" src="http://ad.a8.net/0.gif?a8mat=O6H6A+6S3QSY+5WS+BWVTD" alt="">
 *
 * つまり、以下のような html ソースを生成すれば OK
 *   <a href="http://px.a8.net/svt/ejp?a8mat=A8mat番号&a8ejpredirect=商品ページのURL" target="_blank">
 *   <img border="0" alt="Click Here!" src="表示させたい画像のURL"></a>
 *   <img border="0" width="1" height="1" src="http://ad.a8.net/0.gif?a8mat=A8mat番号" alt="">
 *
 * 問題は、どうやって画像のURLを取得するか?
 *   →
 *      同一ページで扱っている商品が1つだけの場合は、いちばん最後の jpeg ファイルが目的の画像である場合が多い
 *      という経験則に基づき、いちばん最後の jpeg ファイルをとりあえず採用。駄目だったら、生成したhtmlソース
 *      を手で書き換えてね、って方法を採用します (^^;
 *      同一ページで複数商品を扱ってる場合は、ほとんど手書きでの修正が必要になってしまいますが、ごめんなさい。
 */

cnt     = 0;
w       = 0;
h       = 0;
img_url = "";
if ( (img != "") && (num > 0) ) {
  for ( i = 0; i < num; i++ ) {
    if ( img[i].src.lastIndexOf('.jpeg') > 0 )
      cnt = i;
  }
  w       = img[cnt].width;
  h       = img[cnt].height;
  img_url = img[cnt].src;
  window.open(img_url, 'Image',
              'scrollbars=no,width=' + (w+20) + ',height=' + (h+20) + ',left=100,top=100,status=yes,resizable=yes');
  // ↑ ここで表示された画像が期待している画像と違う場合は、生成された html を手書きで修正してください (_o_)
}

linkString = title_txt.substring(title_txt.indexOf('：')+1,title_txt.length);
target_url = 'http://px.a8.net/svt/ejp?a8mat=' + a8mat + '&amp;a8ejpredirect=' + translateString( page_url );
link = '<a href="' + target_url + '" target="_blank">' + linkString + '</a>';

img_str = "";
if ( img_url != "" ) {
    img_str = '<img border="0" alt="' + linkString + '" src="' + img_url + '" width="' + w + '" height="' + h + '" />';
    img_str = '<a href="' + target_url + '" target="_blank">' + img_str + '</a>';
}
acc_str = '<img border="0" width="1" height="1" src="http://ad.a8.net/0.gif?a8mat=' + a8mat + '" alt="" />';

if ( str == "" ) {
    if ( img_url == "" )
        prompt('', link + acc_str);
    else
        prompt('', link + '<br />' + img_str + acc_str);
}
else {
    gTag = "";
    str  = translateString( str );
    if ( img_url == "" )
        qTag = '<blockquote cite="' + page_url + '"><p>' + str + '</p><cite>' + link + acc_str + '</cite></blockquote>';
    else
        qTag = '<blockquote cite="' + page_url + '" style="width: 88%; padding: 3px;"><p style="float: left; width: 65%;">' + str + '</p><p style="float: right; width: 34%; background-color: #FFF;">' + img_str + '</p><p style="float: left; width: 75%; background-color: #FFF;"><cite>' + link + acc_str  + '</cite></p></blockquote>';
    prompt('',qTag);
}
</SCRIPT>

使用例 その1

17型ワイド液晶と充実の機能多彩なメディアに記録が可能

使用例 その2

■素材・綿95％、ポリウレタン5％

Ｖネックポロ

マウスで選択中の画像の URL を JavaScript のみで取得する方法をご存知の方がいらっしゃいましたら、ぜひ教えてください。 よろしくお願いします。

画像の URL を取得する方法がわかれば、楽天市場以外の A8.NET 経由での商品リンク生成にも使えると思います。

楽天ブックスの場合は、画像のURLをISBNから決めうちにできたので楽勝だったんですが……。

注意: この記事で紹介しているスクリプトを使用するときは、必ずご自分のアフィリエイトID(a8mat番号)に書き換えてから使ってください。そのまま使うのはやめてください。よろしくお願いします。 (2008年4月28日追記)