cocoonでカエレバのような商品リンクボタンを設定する

ブログ運営
この記事は約6分で読めます。
スポンサーリンク

こんにちは

今回は、cocoonユーザーのために商品リンクのボタン化について説明します

私がカエレバを使ってボタン作成をしようとしたらCSSが反映されずうまくいかなかったので、その備忘録も兼ねて。

私は結局、cocoon付属の機能を使ってボタンを作成しました

また、cocoonのamazonボタン作成時のエラー

RequestThrottled
You are submitting requests too quickly. Please retry your requests at a slower rate.

の私なりの対処法も載せています

カエレバとそのボタン化とは

カエレバとは、amazonや楽天の商品リンクを見栄え良くまとめることができる無料サービス。

カエレバで取得したコードに対してのCSS(サイトの見栄えのためのコード)を自分のサイトに設定すると見栄えの良いボタンができるという、ブロガーさんでもたくさんの人が利用しているものです

カエレバのサイトと、その設定方法については詳しく解説している記事がたくさんあるので私の方では割愛します

商品紹介ブログパーツ カエレバ
ありそうで無かった、商品紹介用のブログパーツあります!

ボタン化についても、コードをコピペするだけで(普通は)できるらしく、解説記事も豊富です

CSSコピペでOK!カエレバ・ヨメレバ・トマレバのデザインをまとめてカスタマイズ!
このブログはわかったブログの運営者かん吉さんが開発したブログツール「カエレバ」「ヨメレバ」「トマレバ」を利用しています。 これらのツールは、商品・書籍・宿泊施設を紹介するのにとても便利で、多くのブログサイトで利用されてい ...

ですが私の場合カエレバのリンクは作成できるのですが、CSSが反映されず見栄えの良いボタンにならなかった!

CSSについての知識はほぼないので、自分で原因を探して改善することも不可能。
参考になるような情報も得られなかった

そこで他の方法を探していたら、cocoonの機能として商品リンクのボタン作成があったのでこの方法で作成しました

cocoonの機能でも、もしもアフィリエイト経由で設定できました
もちろん直接の設定もできますよ

cocoonの開発者さんおよびその関係者様、とても使いやすく素敵で機能も豊富なテーマを無料で皆さんに提供していただいて、本当に感謝しています。

くま
くま

ありがとうございます

cocoonではカエレバのボタン化が難しいのか?

twitterでうまくいかないことをつぶやいていたらこんな情報が。

原因がなんであれ、cocoonでカエレバのボタン化ができていない人がいるということはわかった

作業前に確認しておきたいこと

実際にcocoonの機能で作成したボタンがこちら

見栄えが良いボタンがなんとかできました

 

超ざっくりとした手順

  • cocoon設定項目からAPIを設定
  • 商品のidをショートコードにコピペ (楽天のショートコードで)

 

まだ設定など不十分なところはありますが、とりあえずこのような表示をすることを目的に解説します

なお、詳しい操作はcocoonの開発者さんのサイトをご覧ください

私の記事の、作業する前の条件に関する項目だけは読んでおくことをお勧めします

Cocoon 1.3.0公開。Amazon・楽天商品リンクに独自ボタン挿入オプション追加。
Cocoon 1.3.0のアップデート情報。

こちらのページから、自分の設定したい項目に飛んでより詳しく見てみると良いでしょう

必須条件

  • amazonのリンクを作成するためにはamazonアソシエイトに合格している必要がある
  • cocoonを使っている

当たり前ですが、上記二つは必須です

特に、amazonアソシエイトがないとamazonのアフィリエイトリンクを作成できないので気をつけましょうね

前提条件

  • amazonアソシエイトで商品が買われたことがない人は、Rakutenアフィリエイトも準備する
  • もしも経由で設定したい場合は、提携しておく

楽天アフィリエイトはすぐに始められますし、yahooはもしもアフィリエイト経由で設定できるので私はそちらの方法で行いました

Rakutenアフィリエイトの始め方

もしもアフィリエイトのやり方・使い方|Amazon楽天Yahooショッピング編

特に、amazonアフィリエイトのAPIの仕様変更により、amazonアソシエイトで商品が買われたことがないと制限がかかるらしいです

詳しくはこちらの記事を参考に

2019年からAmazonアソシエイトはPA-APIが必須?カエレバを使っている人は要注意

この仕様により、私はcocoonの機能でamazonのAPIを利用することができませんでした

ボタンは楽天のAPI(楽天のショートコード)を使用しています

amazonのショートコードを利用した場合、次のようなエラーが起こりました

RequestThrottled
You are submitting requests too quickly. Please retry your requests at a slower rate.

どうやら前述のAPIの制限が怪しそうなので、

  • amazonのショートコードで楽天,yahooも表示

という形式ではなく

  • 楽天のショートコードでamazon,yahooも表示

に変えてうまくいきました

これらのエラーが出ている人は試してみてください

楽天商品リンクショートコードの使い方。サンプルつき。
楽天商品リンクを作成するためのショートコードの使い方を詳しく解説しています。オプションを利用することで、様々な表現を行うことが可能です。

cocoonの機能で商品リンクボタンを作る

さて、お待たせしました
リンクとそのボタンを作る手順です

cocoon設定

まず、cocoonの設定でアフィリエイト関連の設定をします

より詳しい記事はこちら

Amazon商品リンクの初期設定方法と使い方
Cocoonの「Amazon商品リンクタグ作成ショートコード」機能の使い方を詳しく解説しています。

wordpressのメニューからcocoon設定を選び、その中からAPIを選択します

あとはその設定項目を入力していきます

cocoonはとても親切なので、設定項目一つ一つにヘルプのリンクが貼ってあります

適宜そのページに行って設定していけばいいでしょう

ショートコードを打ってみる

設定が終わったら、新規の記事や適当な記事に行ってショートコードを入力してみます

ショートコードの出し方は、私の場合

適当な文字を打って、それを選択、ショートコードにする感じ。

「楽天リンク」を選択すると

rakuten id="ID" kw="キーワード"

というのが生成されると思います

こちらのIDとキーワードを設定するとボタン作成できます!

詳しい記事はこちら

楽天商品リンクショートコードの使い方。サンプルつき。
楽天商品リンクを作成するためのショートコードの使い方を詳しく解説しています。オプションを利用することで、様々な表現を行うことが可能です。

毎回のショートコードの生成、IDの設定は面倒なのでブックマークレットを設定すると良いでしょう

くま
くま

詳しい説明は他の人に任せます

まとめ

cocoonでの商品リンクボタン作成についてお話ししました

私のようにカエレバの装飾が反映せずに悩んでいる人の参考になれば幸いです

参考にしたページまとめ

作業する上で参考にさせていただきました。
ありがとうございます

商品紹介ブログパーツ カエレバ
ありそうで無かった、商品紹介用のブログパーツあります!
CSSコピペでOK!カエレバ・ヨメレバ・トマレバのデザインをまとめてカスタマイズ!
このブログはわかったブログの運営者かん吉さんが開発したブログツール「カエレバ」「ヨメレバ」「トマレバ」を利用しています。 これらのツールは、商品・書籍・宿泊施設を紹介するのにとても便利で、多くのブログサイトで利用されてい ...
Cocoon 1.3.0公開。Amazon・楽天商品リンクに独自ボタン挿入オプション追加。
Cocoon 1.3.0のアップデート情報。
楽天アフィリエイト:楽天アフィリエイトのはじめ方
楽天アフィリエイトの初心者ガイド。パソコンのブログやSNSで楽天アフィリエイトをはじめる方法を紹介します。楽天アフィリエイトは商品を紹介してポイントを稼げる日本最大級のアフィリエイトサービス!成果報酬は1ポイントからお支払い。便利なブログパーツなど機能も充実。スマホにも対応。
もしもアフィリエイトのやり方・使い方|Amazon楽天Yahooショッピング編
もしもアフィリエイトといえば、Amazon、楽天市場、Yahoo!ショッピングが一括管理できて便利なASPですよね。今回は、もしもアフィリエイトを始めるか迷っている方や始めて間もない方向けに、Amazon、楽天市場、Yahoo!ショッピング
2019年からAmazonアソシエイトはPA-APIが必須?カエレバを使っている人は要注意 | うぇーーーいwww
Amazon商品リンクの初期設定方法と使い方
Cocoonの「Amazon商品リンクタグ作成ショートコード」機能の使い方を詳しく解説しています。
楽天商品リンクショートコードの使い方。サンプルつき。
楽天商品リンクを作成するためのショートコードの使い方を詳しく解説しています。オプションを利用することで、様々な表現を行うことが可能です。

コメント

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