AmazonJSプラグインを利用するために行ったこと。


色々ハマりました。一番ハマったのは以前AWSで設定をしていてその関係なのか、なぜかうまくいかず。
新しいアカウントを作ってやることにしました。
「ここは視覚的に説明あると良いな」と思ったところを軽くまとめました。

プラグインをブログにインストール&有効化

ブログの方で、AmazonJSをプラグイン>新規追加で検索します。
amazonjs00
インストールをしたら忘れずに有効化を。

amazonjs01

指定されたディレクトリーにフォルダを作る

有効化して、設定>AmazonJSをクリックするとロリポップの場合は警告が出てきました。ConoHaVPSだと出てきませんでした。
内容は、~(ブログを置いているサーバーのパス)/cache/amazonjs/を作ってアクセス出来るようにとのこと。

もし表示された方は、サーバーに入って指定ディレクトリに「amazonjs」というフォルダを作り、さらにその中に「amazonjs」というフォルダを作ってください。
パーミッションもアクセス出来るように設定。644や666はダメでした。766だとエラーは消えました。
パーミッションの設定はサーバー上のフォルダを選択して「commandを押しながらi」または「ctrlを押しながらi」で出来ます。

amazonjs14

Amazon.comでアカウント作成をしていく。

amazonjs04

普段使っているAmazon.jpとは別にAmazon.comでアカウントを作成します。
メールアドレスはAmazon.jpと同じものにします。
アカウント作成をクリックするとこのような画面になります。
(下の重要ってとこにも書いてありますね)
amazonjs04-2
Manage Your Accountをクリック。

amazonjs04-1
こちらのリンク。

amazonjs05
何か表示されます。翻訳かけたり選択して色々やってみましたが、×を押すのが無難でした。
(違うページに飛んだりしてそこで作ったアカウントは無効だったり・・・。)

amazonjs06
Access Keys(Access Key ID and Secret Access Key)をクリック。

アクセスキーIDやシークレットアクセスキーをメモ

amazonjs07
Create New Access Keyをクリックします。画像では薄青色ですが実際は濃い青色です。
3つ以上アカウントを作ることが出来ないためこのような色になっています。
3つ目を作りたい場合は後述しています。

amazonjs08
AWSAccessKeyId=XXXXXXX
AWSSecretKey=XXXXXXXX

この情報が記載されたCSVをダウンロードすることが出来ます。

amazonjs09
Show Access Keyを開くことで一時的に見ることも出来ます。

一度この表示を閉じると、シークレットアクセスキーは見れなくなるのでダウンロードしてた方が良いかもしれません。

Create New Accessボタンは「Inactive」または「active」のアカウントを2つまで作れます。
Deleteすればいくつでも新しいアカウントを作ることが出来ます。(最大2つまでは変わらず)

ブログ側にて、AmazonJSプラグイン設定にアソシエイトIDを入力

amazonjs02

入力するアソシエイトタグの設定はここに表示されているものです。

amazonjs11
赤枠の中です。

Amazon.comやらAmazon.co.jkやら色々ありますが全項目に入力しても大丈夫です。
ただ、日本のAmazonを使うなら「Amazon.co.jp」は外してはいけません!!
ここに入力していないと、ブログで使おうとした際にこのようなエラーが。

amazonjs10

「Amazon Product Advertising APIのエラー
InvalidClientTokenId
The AWS Access Key Id you provided does not exist in our records.」

また、日本以外を選択したい場合はそこに対応した項目へアソシエイトIDを入力。

ここまでの設定で、ブログにいい感じに貼り付けることが出来ます。

比較

これがデフォルトの貼り付け。

こちらが、AmazonJSを使用して貼り付けたもの。
[amazonjs asin=”4863910207″ locale=”JP” title=”書体の研究 for Digital Creators”]
いい感じです!そしてこの本欲しいです!!

貼り付け方

プラグインを有効化したら、ブログ投稿画面の上部「メディアを追加」の横に「Amazonマーク」が表示されます。

amazonjs12

ここをクリックすると検索画面が表示されるのでキーワードを入力して検索!

amazonjs13

選択を押すとコードが貼り付けられます。

これで完了です。

設定までちょっと長いですが、なるべく詳しく書きましたので参考にしていただければと思います^^