Amazon JSで楽天のリンクも表示させてカエレバ風味な商品紹介パーツに!

IT関連

ブログで商品レビューや書評を書いたら、せっかくなのでその商品や本へのリンクを貼っておきたいですよね?

今回、いくつかのサイト様を参考にAmazon JSを使って商品リンクを作成することにしましたので紹介します。

Amazon JSとは

そもそもAmazon JSというのは、WordPressのプラグインで、以下のようなことが可能になります。

投稿への Amazon の商品の簡単な挿入と jQuery テンプレートを使った表示カスタマイズ

WordPressプラグイン説明より

アカウント登録などが必要なのでそこだけは少し手間がかかるのですが、色んなサイトさんで説明されているので、Amazonアソシエイトをやっている人であれば説明を見ながら登録は可能だと思います。

 

たとえば以下の記事なんかでわりと詳しく解説されていました。

302 Found

 

なぜわざわざプラグインを使うのか

Amazonアソシエイト(アフィリエイト)をやっていれば、普通のAmazonのページから商品リンクを作成することができるようになっています。

ただ、そこで作成される商品リンクはなにやら広告っぽさが強すぎて、特にブログの本文中に使うにはどうも雰囲気が合わないんですね。

たとえば以下のような見た目になってしまいます。

 

なんかサイズ小さくて見づらいわりにゴテゴテしてますよね?

どうもこの感じがイヤだったので、もう少しすっきりした見た目にできないかということで色々調べた結果、Amazon JSを使用することにしました。

また、このプラグインを使用すると、デザインのカスタマイズだけではなく表示内容のカスタマイズもできるのがいいですね。

ブログの紹介を見て買ってくれる人には楽天ユーザの方もいるはず

ただ、Amazon JSってその名のとおり、基本的にはAmazon用。

今はまだ生まれたてのブログで、おそらくほぼ読者いないと思いますが、今後運営を続けていく中で検索から記事を見つけてくださる方が出るかもしれません。(というか読んでくださる方増えてほしい!)

 

そうしたときに当ブログで紹介した商品に興味を持って、「自分も使ってみたい!」って思ってくださった方がいたときに、もしかするとAmazonではなく楽天をメインにお買い物されているかもしれません。

だとすると、楽天のリンクもあったほうが便利かと思います。

 

というわけで、楽天のリンクも同時に作れるサービスはないかという話になるのですが、わかったブログのかん吉さんが提供してくださっているサービス、「カエレバ」や「ヨメレバ」が有名だと思います。

ただ、せっかくWordPressを使っていてプラグインもあるのに、わざわざ外部サービス使うのもなぁ、と思ったりしたので、Amazon JSでなんとか楽天リンクを追加できないか調べていると、以下の記事にてその方法が紹介されていました。

https://hazilog.com/amazonjs-customize

探せばあるものですね!

CSSを編集したりしながら、ヤスカズラボ用にカスタマイズ

当ブログでどんな風に商品紹介のリンクを使うかを考えたとき、使ってみてよかったモノの紹介のほかに、これから買ってみようと検討している段階で複数の候補を羅列したりすることもあるかと思ったんですね。

たとえば以下の記事なんかがそうです。

外れにくいレンジフードフックを探したら100円ショップに落ち着いた
レンジフードに調理器具を吊るすために、外れにくいフックを探していたところ、結局100円ショップに落ち着きました。 調べた過程と、最終的に購入した商品を紹介してみます。

 

記事本文中に複数の商品を紹介した場合、商品リンク自体にあまり情報が多すぎると見づらいような気がしたので、下記のサイトさんの記事を参考に、表示内容をカスタマイズしました。

http://lifeis-party.com/web/140.html

 

最終的に、ある程度情報を絞りつつ、あまり主張が強すぎないような商品リンクに変えることができました。

今後運営を続ける中で、ある程度デザインや表示内容は変更するかもしれません。

 

機会があれば、細かなカスタマイズの記事なども書いてみるかも?

どちらかというと参考サイトのリンク集みたいな形になりましたが、これからAmazon JSを使ってみようという方の参考になれば幸いです。

コメント