Amazon JSの設定と使い方

この記事を読めば…Amazon JSをWordPressに導入するための設定と、Amazonアソシエイト広告の記事への挿入方法がわかります。

Amazon JSは、Amazonアソシエイトの広告をシンプルかつきれいに表示できるプラグインです。広告に表示する商品検索も、とても簡単にできるので、1度設定を終えてしまえば、新しい広告の挿入が簡単にできます。

Amazonアソシエイトの広告のデザインが気になる方は、ぜひAmazon JSプラグインを試してみましょう。

Amazon JSのインストール

まずはAmazon JSのプラグインをインストールしましょう。プラグインのインストールは、WordPress管理画面からプラグイン検索を行う方法とプラグインファイルをダウンロードする方法の2つがあります。

プラグイン検索し、インストールする

WordPressの管理画面へログインし、プラグインの新規追加画面を開きます。そして、検索欄にキーワードを入力します(①)。Amazon JSのプラグインを見つけたら、インストールを行いましょう(②)。

Amazon JSをキーワードで検索

キーワードは、「AmazonJS」と「Amazon JS」の両方を試してみましょう。2018年1月に試した時は、「AmazonJS」と検索した場合、該当のプラグインのみが表示されましたが、「Amazon JS」と検索した場合は、該当のプラグインが表示されませんでした。

プラグインファイルをダウンロードし、インストールする

もし、プラグイン検索しても見つけられない場合は、こちらのWordPressプラグインディレクトリからZIPファイルをダウンロードしましょう。

WordPressプラグインディレクトリからダウンロード

ダウンロードできたら、プラグインの新規追加画面からZIPファイルをアップロードし、インストールを行います。

プラグインをインストールする詳しい方法は、WordPressでプラグインをインストールする方法を参照してください。

Amazon JSの設定方法

プラグインのインストールが完了したら、ナビゲーションメニューの設定にAmazon JSの項目が追加されます。クリックし、必要な設定を行っていきます。

Amazon JSの設定ページを開く

Amazon JSの設定画面を開くと、「Product Advertising APIの設定」と「アソシエイトタグの設定」が必要なことがわかります。まず、Product Advertising APIの設定を行います。

Amazon JSの設定画面

これは、Amazonアソシエイトプログラムへ参加すれば、必要な情報が取得可能になります。登録・利用は無料でできますので、登録をしておきましょう。

リンクをクリックすると、ログイン画面が表示された後に「Amazon Product Advertising API」のページが表示されます。「Product Advertising API の利用をはじめるには」の欄にある「利用をはじめる」ボタンをクリックします。

Amazon Product Advertising APIの利用をはじめる

クリックすると、アクセスキーとシークレットキーが表示されます。

アクセスキーとシークレットキーを表示する

Amazon Product Advertising APIのページで確認したアクセスキーとシークレットキーを、Amazon JSの設定画面でそれぞれ入力します。

アクセスキーとシークレットキーを入力する

次に、アソシエイトタグの設定を行います。これは、AmazonアソシエイトプラグラムのアソシエイトIDを入力します。アソシエイトIDは、Amazonアソシエイトの管理画面にログインしたら、右上に表示されています。

AmazonアソシエイトIDの確認

アソシエイトタグの設定で、ご自身のアソシエイトIDをAmazon.co.jpの欄へ入力します。日本のAmazonアソシエイトプラグラムのアソシエイトIDは、全て「-22」で終わるものになっています。

アソシエイトタグの設定

最後に、設定画面の下へスクロールしていき、「設定を保存」ボタンをクリックします。これでAmazon JSの設定は完了です。

続いて、実際に記事にAmazonアソシエイトの広告を挿入してみましょう。

Amazon JSの使い方

投稿または固定ページ一覧から、Amazonアソシエイトの広告を追加したい記事の投稿編集画面を表示します。Amazon JSプラグインを有効化していると、メディアを追加ボタンの横にAmazon JSのボタンが表示されます。

Amazon JSのボタン

広告を挿入するためには、このボタンをクリックします。クリックすると、広告の検索ウィンドウが表示されます。

まずは、「キーワード検索」か「ASIN/URLで検索」か選びます(①)。検索キーワードを入力し、検索します(②)。検索を実行したら、下の欄に該当商品が表示されます。目的の商品を見つけたら、その商品の「選択」ボタンをクリックします。

Amazonアソシエイト商品の検索

もし、広告を追加したい商品が決まっている場合、ASIN/URL検索の方が早いでしょう。ASINについては、Amazon.co.jpヘルプ:ISBN/ASINについてを参照してください。

商品の「選択」ボタンをクリックすると、広告のデザインテンプレートを選択できるウィンドウに切り替わります。いくつかありますが、デフォルトがおすすめです。下の欄で、ブログに実際に表示した際のデザインを確認できます。

Amazon JSでAmazonアソシエイト広告を挿入

広告のデザインが決まったら、挿入ボタンをクリックします。

これで、記事へのアソシエイト広告の挿入が完了しました。テキストエディターでは、以下のように挿入されます。

Amazon JSのコード

実際にブログ画面でどのように表示されているか見てみましょう。

Amazon JSで挿入した広告の表示確認

きれいに表示されていますね。Amazonアソシエイトのデフォルトの広告デザインとは、かなり違うものになっており、表示する項目が整理されています。Amazonで広告したいものがあれば、ぜひAmazon JSを使用してみてください。

よかったらシェアしてね!
  • URLをコピーしました!