Amazonアフェリエイトへの道 #4 オペレーション仕様

2023年12月11日

アプリケーション

eyecatch Amazonアフェリエイトバナーは、ブログなどに掲載することがほとんどなので、そのブログにあった見栄えで表示されなければいけません。 今回はその見栄えに最低限マッチできる設定について検討していきます。

最低限のカスタマイズ

これまで使っていたAmazonアソシエイトツールでのAmazonバナーは、全体サイズが固定でそれが、携帯電話サイズに合わせていた(と思われる)ため、パソコン表示をしているブログやホームページでは、スッカスカでなんともおマヌケな見え方になっていました。 こんな感じです。 ね、スッカスカでしょ? せっかくスペースがあるのに、もっと活用したいですよね。 というわけで、前回はレスポンシブにも対応したデザインを検討したのですが、それでも、バナーをページに設置した時に必要な要素は次の2点があります。
1. 画像サイズ 2. フォントサイズ
この2つをある程度自由に設定できるようにすることで、ページ内で表示するデザインバランスがよくなるはずです。 あとこれに、対象商品のURLと、自分のアフェリエイトIDが入力できれば、自分好みのAmazonのアフェリエイトバナーができあがるというワケです。

設定画面公開

実際に入力するモノだけを精査して、次のような入力フォームデザインになりました。 ※【注意】ボタンを押してもまだバナーは生成されません。
今後開発を進めていくと、機能追加に伴って設定項目も増えていきますが、基本的にはこれが初期設定になります。 設定内容は変更するとブラウザで記憶するので、一度使うと同じ設定でURLだけ切り替えてバナーを作成するようになります。

あとがき

究極のカスタマイズとして、出来上がる生成バナーのHTMLテンプレートというのを考えているのですが、 このHTMLを独自にカスタマイズできるようにしようと考えています。 このテンプレートもブラウザにデータ保存しておくことで、独自のオンリーワン・バナーがサクサクと作れてしまうという夢のようなツールになる予感がしてきましたね。 次回ベータ版ができますので、実際に使いたい方は、もうしばらくお待ちくださいませ。