メルカリ対応!Cocoon用ショートコード生成ツールの使い方

※記事内にはアフェリエイトリンクが含まれています。

メルカリ簡単リンク生成(Cocoonショートコード用)の使い方を解説します。

これは、Wordpressのテーマ「Cocoon」で商品リンクを表示するショートコードに、メルカリや公式サイトのボタンを追加するツールになり、サンプルコードを理解していれば直感的に使えるかと思います。

Amazon商品リンクショートコードの使い方。サンプル付き
Amazon商品リンク作成ショートコードの使い方を、出来る限り優しく説明しています。便利なオプションもあるので、欲しい見た目をある程度手に入れることができます。
スポンサーリンク

メルカリアンバサダーIDを入力

上部にあるメルカリアンバサダーIDに、あなたのID(10桁の数字)を入力。保存をボタンを押すとブラウザに保存するため、リロードや再アクセスした時に入力の手間が省けます。

ASINコードについて

AmazonのASINコードと検索キーワードを入力し、生成ボタンをクリックすると通常機能するショートコードが排出されます。ブックマークレット2つ作成してあるので、好きな方を使って下さい。

Amazonの商品ページからASINを取得するブックマークレット

javascript:var asin=prompt('ASIN:',location.href.match(/dp\/(\w{10})/)[1]);

勝手コピーされるのが嫌な人向けのため、自身でコピーする必要があります。

Amazonの商品ページからASINをコピーするブックマークレット

javascript:(function(){const asin = location.href.match(/dp\/(\w{10})/)[1];navigator.clipboard.writeText(asin);alert(`ASIN: ${asin} クリップボードにコピーします`);})();

OKでコピーするため手軽。ブラウザの設定によってはブロックされるので許可が必要。

ブックマークレットの設定

ブックマークレットは、何でもいいのでブックマークし、編集から名前の変更(AmazonASINとか)と、URLをブックマークレットのコードに書き換えることで使えます。Amazon商品ページを開いて、そのブックマークをクリックするだけ。

メルカリの設置場所

メルカリのボタンを設置場所を選択します。btn1がAmazonの前で、btn2とbtn3は最後になる。3つ同時に設置できてしまうため、配置したい場所を1つ選択してください。扱う商品によって出品数が多ければ「販売中のみ表示」のチェックを入れて反映させることもできます。

  • btn1:青ボタン
  • btn2:緑ボタン
  • btn3:紫ボタン

アフィリエイトタグの入力も可

追加タグにはアフィリエイトタグをそのまま挿入してもボタン表示できます。例えば、エレコムの公式ショップリンクを入れると以下のような表示も可能。これはバリューコマースで生成したMyLinkコードをそのまま挿入しています。

ただし、シングルクォーテーションが挿入されているタグだと表示できなくなります。例えば、リンクシェアで「リンクを新しいウィンドウで開く」を選択するとシングルクォーテーションが追加され機能しません。これを選択しない、もしくはダブルクォーテーションに書き換えることで使うことはできます。

  • target=’new’ シングルクォーテーション
  • target=”new” ダブルクォーテーション

未入力で排出しない仕様

追加タグの項目は入力しなければ何も排出しません。何か入力するとbtn1_tag/btn2_tag/btn3_tagオプションが追加されるようになっていて、アフィリエイトタグなどリンクタグでない場合にはテキストとしてそのまま表示されてしまいます。そのため、btn1_urlオプションなどを使いたいときには手動で追加するように。

Amazon/楽天/Yahoo!の検索ボタン非表示

非表示にチェックを入れると amazon=0 rakuten=0 yahoo=0 オプションが追加され、それぞれの検索ボタンを非表示にできます。たとえば、Yahoo!にはない商品を紹介するとき、Yahoo!非表示にチェックを入れることでYahoo!は表示しない。

生成→コピー→ブログに張り付け

すべて設定したら、生成ボタンを押してコピー、それをブログに張り付けるだけ。

不具合や要望がありましたら@hipcjpまで

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