Amazonの商品情報をブログに表示させるプラグインは皆さん色々なものをお使いのようで、コレといった決め手がないようである。
このブログでも、amazonアソシエイトから直接取得したリンクコードを貼り付けているが、イマイチ野暮ったい表示となってしまう。
そこで以前からインストールしていたが使っていなかったwp-tmkm-amazonと、今回検索して使いやすそうだったAmazonJSを使ってみた。
 

 


 

インストール

wp-tmkm-amazonは以前インストールしたのだが、今はアップデートされていなかった。
 
図1:wp-tmkm-amazon-1.13ja
図1:wp-tmkm-amazon 1.13ja

 
別の人が引き継いでアップデートしているようなので、インストールされていたwp-tmkm-amazon 1.13ja を削除して、最新のwp-tmkm-amazon 1.5bをインストールした。
 
図2:wp-tmkm-amazon-1.5b
図2:wp-tmkm-amazon-1.5b

 
いずれも『プラグイン』→『新規追加』から検索して、『いますぐインストール』から、そのまま簡単にインストールが出来る。
 
図3:AmazonJS
図3:AmazonJS

 
但し、AmazonJSのほうは、インストール後にwordpress/wp-content/cache/amazonjsディレクトリを作成して、権限を0777にする必要がある。
もし、上記のディレクトリを作成せずにAmazonJSの設定画面に行くと以下のような警告が表示される。
 
図4:AmazonJSのエラー表示
図4:AmazonJSのエラー表示

 
詳しくは、以下のAmazonJSの作者のブログを参照のこと。
AmazonJS (WordPress Plugin) | kwLog
 

設定項目

いずれも設定に必須なものは、以下の3つだ。
 

wp-tmkm-amazon AmazonJS 説明
アソシエイト ID アソシエイトタグ amazonアソシエイトのトラッキングID
Access Key ID アクセスキーID amazonアソシエイトのProduct Advertising APIから取得するアクセスキー ID
Secret Access Key 秘密アクセスキー amazonアソシエイトのProduct Advertising APIから取得するシークレットアクセスキー

 
amazonアソシエイトのProduct Advertising APIから取得するアクセスキー IDとシークレットアクセスキーの取得方法は以下のブログで詳しく紹介されている。
 
Access Key IDとSecret Access Keyの取得 – Amazon Web サービス
 
設定項目で異なるのは、以下の点だ。
 
wp-tmkm-amazonではAmazon.co.jp専用で、決められた書式で表示される。
 
図5:wp-tmkm-amazon設定画面
図5:wp-tmkm-amazon設定画面

 
AmazonJSではAmazon.co.jp以外にも対応しており、各サイトで取得したアソシエイトタグを設定できる。
また、AmazonJSでは『カスタムCSS』と『カスタムスクリプト』が選択できる。
それぞれ、以下のファイルを作成することで表示を変更することが出来る。

カスタムCSS wordpress/wp-content/themes/twentyeleven/amazonjs.css
カスタムスクリプト wordpress/wp-content/themes/twentyeleven/amazonjs.js

 
図6:AmazonJS設定画面
図6:AmazonJS設定画面

 

使用方法

wp-tmkm-amazonは『投稿の編集』ページの下のほうに検索フォームが表示されている。
そこでAmazonの商品を検索することが出来る。
検索結果にブログでAmazonの商品を表示させるためのタグ([tmkm-amazon]~[/tmkm-amazon])が表示されているので、このタグをコピーして、表示させたい箇所にペーストすればいい。
 
図7:wp-tmkm-amazon検索フォーム
図7:wp-tmkm-amazon検索フォーム

 
AmazonJSは『投稿の編集』ページの上のほうに検索フォームへのアイコンが表示されている。
このアイコンをクリックすると検索フォームが表示される。
 
図8:AmazonJS検索フォームへのアイコン
図8:AmazonJS検索フォームへのアイコン

 
この検索フォームでAmazonの商品を検索することが出来る。
検索結果から好きな商品の選択ボタンを押す。
 
図9:AmazonJS検索フォーム
図9:AmazonJS検索フォーム

 
すると、商品情報とブログでAmazonの商品を表示させるためのタグ([ amazonjs asin= ~ ])が表示されるので、挿入ボタンを押すとブログに表示コードが挿入される。
 
図10:AmazonJS検索結果と表示コード
図10:AmazonJS検索結果と表示コード

 

表示結果

wp-tmkm-amazonは以下のように表示される。
 
[tmkm-amazon]479736758X[/tmkm-amazon]
 
AmazonJSは以下のように表示される。
 


 
普通にAmazonから取得したコードで表示すると以下のように表示される。
 

 
 
 

 


Categories: WordPress


Leave a Reply