Amazon Search 導入支援ツール

導入に際して、まずはじめに。

  1. この支援ツールは IE 6.x および FireFox 1.x で動作確認しております。
  2. 現在、当方で動作確認済みのブログは下記の通りとなります。
    • MobavleType
    • TypePad
    • ココログ
    • livedoor Blog
    • JUGEM
    • Yaplog
    • FC2Blog
    • Seesaa BLOG
    その他、動作未確認のブログサービスの場合、JavaScript や HTML タグを制限しているサービスでは動作しません。(goo BLOGや Doblog 等・・・)また、ウェブリログのように個別記事に設置できなかったり、RDF が HTML 内に生成されないトップページに設置しても無意味な商品が表示されてしまいますがご了承下さい。
  3. CGI が使える環境の方は、表示を高速化するためのプログラムとして「中継君JS」の導入もご検討下さい。

導入手順について

  1. まず、Amazon アソシエイト・プログラムを申し込んで、ご自分のアソシエイトIDを取得します。 ※Amazon Web サービスのデベロッパー・トークン ID は不要です。
  2. 下記の設定フォームから各種設定項目を設定します。
  3. 自動生成される文字列を表示したいテンプレート(固定リンクページに表示したいなら「Individual Entry Archive」テンプレート)内に貼り付けます。
  4. ブログを再構築するだけで完了! ※ブログ以外のサービス等は設置するだけでOKです。

ちょっとしたカスタマイズをしたい場合は?

  1. 見栄えを変更したい → css を定義して下さい。 style=lite, style=heavy の場合は下記のような div - class 指定つきで結果が返されますので、ご自分の stylesheet で適宜見栄えを変更下さい。その他の style の場合は、参考 css コードを元に編集下さい。
    <DIV class=drk7jpSimilarity> <DIV class=drk7jpSimilarityHeader>$powered(footer指定なし)</DIV> <DIV class=drk7jpSimilaritySiteTitles>検索結果タイトル(lite版/heavy版)</DIV> <DIV class=drk7jpSimilaritySiteSummarys>検索結果タイトル(heavy版)</DIV> <DIV class=drk7jpSimilarityFooter>$powered(footer=1の時)</DIV> </DIV>
    ※drk7jpSimilaritySiteTitles、drk7jpSimilaritySiteSummarysの部分は検索結果数分、繰り返されて表示されます。
  2. 検索精度を更に上げたい → 特殊なタグを埋め込みます RSS には記事の要約もしくは始めから n ワードを出力する場合が多いため、内容が十分でない事が多々あります。解析したいデータの前後に(MT で言えば MTEntryBody タグ)下記のタグを入れてください。
    <!drk7jp_parse_scope> 〜記事〜 <!/drk7jp_parse_scope>

導入設定1: 設定フォームから設定

設定項目および内容説明
設定値
1. 中継君 JS の設定   - 例:http://www.drk7.jp/cgi-bin/App/jc.cgi - ※未使用の場合は、テキストボックスに何も記述しないで下さい。
2. Amazon アソシエイトID の設定   - 運営資金を恵んで下さる方は、そのままでも可(w
3. お使いのブログサービスの選択
4. お使いの文字コードの選択   - MT、その他 : 構築時に設定した文字コードを選択下さい。 - 上記以外は自動で文字コードが選択されます。
5. 広告スタイルの選択   - lite、heavy は従来の表示形式。それ以外は Google AdSense 互換
6. 検索範囲の選択   - ブログの内容にあわせて最適なものを1つ選択すると最もクリック率が良くなります。 - 同時に選択できるカテゴリは3つまでです。 書籍 エレクトロニクス ホーム&キッチン 音楽 DVD ビデオ ソフトウェア ゲーム おもちゃ&ホビー スポーツ ヘルス&ビューティ
7. ref=nosim (直リンク)の出力   - 直リンクにして成果報酬額を 3% から 5% にアップさせます。 出力する
8. コピーライト表示設定   - ヘッダーかフッターに Ads by Drk7.jp が表示されます。
a. 商品表示個数の設定(lite / heavy のみ有効)
b. 商品タイトル名の文字列長の設定(lite / heavy のみ有効)   - タイトル名の文字数を短縮したい場合は短めに設定下さい。 文字で切る
c. 商品説明の文字列長の設定(lite / heavy のみ有効)   - 商品説明を短縮したい場合は短めにを設定下さい。 文字で切る

導入設定2: 設定コードの生成

以下に表示されるコードを全て選択してコピーして下さい。 以下に表示される CSS を参考に CSS を定義してブログの CSS に組み込んで下さい。

導入設定3: 広告のプレビュー(データはsampleです)

導入設定4: 設定コードの貼り付け

Movable Typeの人
  1. Movabletypeにログインし、「Templateの編集」をクリックしてください。
  2. 「Individual Entry Archive」をクリックしてください。
  3. コピーしたコードをテンプレートの中身の表示したい部分にペーストしてください。
  4. 保存をして再構築して完了です。
TypePadの人
  1. TypePadにログインし、「Edit Design」をクリックしてください。
  2. 「Edit Template Sets」をクリックしてください。
  3. 「Individual Archivesテンプレート」をクリックして下さい。
  4. コピーしたコードをテンプレートの中身の表示したい部分にペーストしてください。
  5. 保存をして再構築して完了です。
ココログの人(プロ、ベーシック共通)
  1. ココログにログインし、3つあるタブメニューから「マイリスト」をクリックして下さい。
  2. 「マイリストの新規作成」の1番目の「リストのタイプ」から「リンク」を選択して下さい。
  3. 「リストの名前」をAmazonSearchと入力後、「リストの新規作成ボタン」をクリックしてください。
  4. 表示されたページの「 このリストをウェブログまたはプロフィールページで表示する」をクリックして下さい。
  5. ポップアップでウィンドウが表示されますので、表示させたいウェブログを選択して、ウィンドウを閉じて下さい。
  6. 2つあるタブメニューから「設定」タブをクリックしてください。
  7. 「高度な設定」の「メモの表示:」で「テキスト表示」を選択し「変更を保存」をクリックして保存してください。
  8. 「管理」タブをクリックし、「管理」ページを表示させたら「項目の追加」をクリックしてください。
  9. ポップアップ・ウィンドウが開いたら「メモ」の欄に予めコピーしておいたコードを貼り付けて下さい。
  10. 「追加」をクリックして保存したのち、再構築して完了です。
  11. 参考:自由浮遊社ヱブログ: ココログベーシックでAmazon Searchを設置する
livedoor Blogの人
  1. livedoor Blogにログインし、「Blogの設定/管理」をクリックしてください。
  2. 左側のメニューから「プラグインの設定」をクリックして下さい。
  3. 「上級者向けプラグイン」ををクリックしてください。
  4. プラグインのクイック追加から「フリーエリア」を選択してタイトルに「Amazon Search」を入力して「追加する」をクリックしてください。
  5. 本文にコピーしたコードをペーストし、フォーマット「変換しない」を設定して「設定する」をクリックして下さい。
  6. 左側のメニューから「Blogの再構築」をクリックして保存して完了です。
  7. 参考:Drk7jp livedoor Blog 動作確認用 / 地獄変00:Amazon Searchをlivedoor Blogで導入してみる
JUGEMの人
  1. JUGEMにログインし、左側のメニューから「テンプレートの編集」をクリックしてください。
  2. 「テンプレートの選択」から修正したいテンプレートの「編集」をクリックしてください。
  3. コピーしたコードをテンプレートの中身の表示したい部分にペーストしてください。
  4. 「更新」をクリックして保存して完了です。
  5. 参考:Drk7jp jugem 動作確認用
Yaplogの人
  1. Yaplogにログインし、メニューの「サイドバー」をクリックしてください。
  2. 左側のメニューから「機能追加・編集」をクリックしてください。
  3. 表示された画面内にあるピンク色のボタン「新規追加」をクリックしてください。
  4. 機能名に「Amazon Search」と入力し、HTMLにコピーしたコードをペーストして「保存」ください。
  5. 「機能追加・編集」から現在追加されている機能の「新規追加」をクリックしてください。
  6. サイドバー「機能選択・並び替え」の使用しない機能にリストされている「Amazon Search」をドラッグ&ドロップで使用する機能の好きな場所に移動して下さい。
  7. 保存で完了です。
  8. 参考:Drk7jp yaplog 動作確認用
Seesaa BLOGの人
  1. Seesaa BLOGにログインし、メニューの「デザイン」の「コンテンツ」をクリックしてください。
  2. 新しいコンテンツの追加から、種類「自由形式」、追加先ページ「記事ページ」、配置「メイン」を選択して「コンテンツの追加」をクリックしてください。
  3. タイトルに「Amazon Search」と入力し、HTMLにコピーしたコードをペーストして「保存」ください。
  4. ブログを全て再構築して完了です。
  5. 参考:Drk7jp Seesaa BLOG 動作確認用
FC2BLOGの人
  1. FC2BLOGにログインし、環境設定の「テンプレートの設定」をクリックしてください。
  2. 「修正」をクリックして「HTMLの編集 netmania_aを編集しています」の HTML 内の下記の部分を探して下さい。 <!--more--><hr size="1"><a name="more" id="more"></a><%topentry_more><!--/more--> </td> </tr>
  3. その直下に、生成されたコードをペーストして「更新」ください。
  4. 参考:Drk7jp FC2BLOG 動作確認用
その他の人
  1. JavaScript がOKなテンプレートやページに、生成されたコードを貼り付ければ動作すると思います。
- スポンサーリンク -