Cocoon で用意されているアフィリエイトリンクのショートコード動作確認

商品リンクの貼り方 ブログ

Cocoon の設定で Amaon や楽天のAPI設定をしたので、試しにアフィリエイトリンクを貼ってみようと思ったが、貼り方すらわからないところから始めて、実際に貼ったら思っていたものと挙動が違っていたので、とりあえず気になるやつを全部試す。

アフィリエイトリンクの貼り方

ブログなどでよく見る、Amazon と 楽天の商品紹介用のリンクの貼り方が分からなかったので、それを調べるところから始めた。

こういうやつ。

投稿の編集画面にあるツールバーのショートコード(</>こんなアイコン)から使いたいものを選んで、生成されたショートコードを修正すれば表示される。

例えば、Amazonリンク というショートコードなら、

[amazon asin="ASIN" kw="キーワード"]

というのが表示されるので、紹介したい商品の ASIN を Amazon から見つけてきて、ASIN のところを書き換えて、キーワードを商品を検索するのに使う文字に書き換える。

実際につかってみてどのような表示や動作になるのか検証

他の人がいろんなブログで説明してくれているのだけど、実際のところ使ってみた方が早いので試してみる。

Amazon商品リンク

Amazon からの購入を促すのをメインにする場合はこっちを使う。

Amazonリンク

生成されるショートコード
[amazon asin="ASIN" kw="キーワード"]

編集後の実際の表示。

思っていた挙動と違うのは、画像は商品名をリンクすれば、直接 Amazon の商品画面に移動するが、Amazon とか 楽天Yahoo!ショッピングのボタンをクリックすると直接商品画面に行くのではなくて、各ショッピングモールの検索画面からキーワードで指定した検索結果画面になること。自分がブログの読者の立場なら直接商品画面に行って欲しい気持ちもあるけど、それほど不便でもないので、この件は気にしないようにするために忘れることにする。

パンどろぼう [ 柴田 ケイコ ]
楽天ブックス
¥ 1,430(2024/06/07 21:54時点)

ASIN を取得して編集しなおしてというのが面倒なので、ブックマークレットが用意されている。基本的にはこれを使うのが楽でよい。

Amazonリンク(商品名変更)

生成されるショートコード
[amazon asin="ASIN" title="商品名" kw="キーワード"]

編集後の実際の表示。

title という項目が増えている。商品名の部分を編集するとで商品名を自由に変更することができる。

みたいな使い方もできる。

Amazonリンク(ボタン非表示)

生成されるショートコード
[amazon asin="ASIN" kw="キーワード" amazon=0 rakuten=0 yahoo=0]

編集後の実際の表示。

大ピンチずかん [ 鈴木 のりたけ ]
楽天ブックス
¥ 1,650(2024/06/07 21:55時点)

表題の通りボタンが非表示になっている。わざわざボタンを非表示する場面が思い浮かばないので、個人的には使わなそう。

楽天商品リンク

楽天からの購入を促すのをメインにする場合はこっちを使う。

楽天リンク

生成されるショートコード
[rakuten id="ID" kw="キーワード"]

編集後の実際の表示。

Amazonリンクの直接商品画面に行く部分が楽天になっているバージョン。

オプションでいろいろとカスタマイズできるみたい。

楽天リンクもAmazonリンクと同様にブックマークレットが用意されているのでそれを使っておけば、基本的には問題ない。

楽天リンク(商品名変更)

生成されるショートコード
[rakuten id="ID" title="商品名" kw="キーワード"]

編集後の実際の表示。

隣にいられると思い出す例の香水
香水フレグランスPARFUM de EARTH
¥ 6,105(2024/06/09 17:54時点)

Amazonリンク(商品名変更)と同じ、商品リンク先が楽天バージョン。

楽天リンク(ボタン非表示)

生成されるショートコード
[rakuten id="ID" kw="キーワード" amazon=0 rakuten=0 yahoo=0]

編集後の実際の表示。

Amazonリンク(ボタン非表示)と同じ、商品リンク先が楽天バージョン。

もう少し詳細な設定をしたい場合

基本的な使い方以外にも、価格を表示したりなどいろいろとカスタマイズしたりすることはできるみたいだけど、今のところは必要ないので、その都度考える。

商品リンクに価格を表示したい

価格を表示したいときは下記を設定する。この設定は全体設定で、使用されているショートコードに対して一括で変更される。

価格の表示設定を一括で変更する

Cocoon 設定APIタブ > Amazon価格を表示する にチェックを入れる。

個別で価格の表示、非表示を指定したい場合は、price というオプションを追加する。この時、個別設定は全体設定より優先される。

個別の表示、非表示の指定方法

price=0 を追加すると非表示で、price=1 を追加すると表示。

コメント

タイトルとURLをコピーしました