FC2でAmazon設定
FC2でAmazonウィジェット設定
これから何をするかと言えば、プラグイン「フリーエリア」を追加して、その中に「ウィジェット」を設置します。
1：プラグイン「フリーエリア」を追加する。
（01）
「環境設定」で「プラグインの設定」をクリックします。
（02）
「公式プラグイン」をクリックします。
（03）
挿入先の「プラグインカテゴリ」を選択します。
プラグインカテゴリが、何の話か分からない人は、記事「プラグインカテゴリー」が参考になると思います。
（04）
プラグイン「フリーエリア」の「追加」をクリックします。
（05）
「プラグイン管理」をクリックして戻ります。
（06）
「フリーエリア」の「詳細」をクリックします。
2：「フリーエリア」に、HTMLコードを貼り付ける。
（07）
プラグインの「タイトル（40文字以内）」を、「フリーエリア」から「Amazonさん」に変更します。
タイトルは、お好きなように変更してください。「フリーエリア」では、ちょっと味気ないですからね。
（08）
「コンテンツの文字設定」で、位置（左揃え、中央揃え、右揃え）を選択します。
（09）
「フリーエリア内容の変更」へ、前記事の（13）でコピーしたHTMLコードを貼り付けます。
（10）
「変更」をクリックします。
3：ブログの表示確認と調整。
（11）
ブログを表示してみましょう。プラグイン「フリーエリア」が表示されて、Amazonウィジェットが追加されているはずです。
ウィジェット幅は、足りましたか？位置は、大丈夫でしたか？私は、位置を中央揃えにしたのに、左揃えになっています。やれやれです。
（12）
どうして、中央揃えにならないのか？を調べます。左揃えに設定する人は、読み飛ばしてください。
こういうときは、ソースコードを見てみましょう。
表示する対象（ブロック）に対して、text-alignをかけています。text-alignは、テキストに対して行揃えを行うものなので、正確ではありません。
その上、styleを閉じていません。「;」が必要です。（「style="text-align:center;"」）
（13）
実は、ブロック要素の行揃えについて、簡単で完全な方法を、私は知りません。面倒な方法が多いのね。
それで、私はどうしているかと言えば、「今後は推奨されないけれど簡単な方法」をとっています。
「プラグインの改造」で「【HTMLの編集】」をクリックします。
（14）
次のようなHTMLコードが表示されます。
<!-- ＆freeareaの中にHTMLが代入されます。 -->
<div class="plugin-freearea" &align>
&freearea
</div>
「&align」を「align="center"」に書き換えます。
<!-- ＆freeareaの中にHTMLが代入されます。 -->
<div class="plugin-freearea" align="center">
&freearea
</div>
CSSによる行揃えの正しい方法は、W3Gさんの「CSS によるブロック要素の左右中央揃え」が参考になります。
（15）
「変更」をクリックします。
（16）
ブログを確認してみましょう。中央揃えになりました。
さらにクリックしてみましょう。
（17）
Amazonアソシエイト・セントラルにサインインして、右側に表示される簡易レポートを確認してみましょう。クリック数が「1」になっていると思います。
4：マイショップの管理で行うこと。
FC2管理者ページで、商品リストの確認、検索、追加、カテゴリ分けができるようになります。
（18）
「環境設定」で「マイショップの管理」をクリックします。
（19）
「アソシエイトID」を入力し、「更新」をクリックします。
現状（2007/09/29）、不具合で使えないようです。「アソシエイトID」の入力だけしておいて、実際の作業は、Amazonアソシエイト・セントラルで行うしかありません。
5：承認メール確認。
（20）
最後に、Amazonさんからの承認メールを確認します。
私の場合は、約20時間後に「Amazon.co.jp アソシエイト・プログラムへの参加が承認されました」というメールが届きました。
アソシエイトIDも記載されているので、大切に保管しておきましょう。
記事「Amazonアソシエイト登録」の中の「Amazonアソシエイトとは？」でも書いたように、ブログの内容によっては、申請をお断りされることもあります。
次回予告
次回は、「Amazonインスタントストア」について書いています。
関連記事
Amazonアソシエイトについての記事を、ご紹介します。
1：Amazonアソシエイトをブログに設置する方法
2：さようならは言わない
作成日：2007/09/30 更新日：2007/10/02
« 「Amazonウィジェットの作成」｜「Amazonインスタントストア」 »
コメントありがとうございます。
現在、コメントさんも、お休みしています。
トラックバック
http://kumacrow.blog111.fc2.com/tb.php/66-1a3bbff3
