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-amazonAmazonJS説明
アソシエイト IDアソシエイトタグamazonアソシエイトのトラッキングID
Access Key IDアクセスキーIDamazonアソシエイトの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』と『カスタムスクリプト』が選択できる。
それぞれ、以下のファイルを作成することで表示を変更することが出来る。

カスタムCSSwordpress/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