「カッテネ」を導入するときはプラグインかhtml・cssを使います。
私はwordpressテーマに「JIN」を使用していますが、ネットでググってみると「JIN」でカッテネのプラグインを使用すると表示が崩れるという意見が何個かあったので、html・cssで導入しました。参考にしたサイトはこちら▼
html・cssでも導入してから数日パソコン表示のボタンが小さかったりおかしいことがありました(スマホの表示は正常)。ただ2~3日経ったら正常に表示されていたので、ボタン表示がおかしいという方は数日時間を置いて再度確認してみることをお勧めします。
そして今回の記事ではタイトルにもある通り、「カッテネ」を利用している人向けにバリューコマースMyLinkの作成方法を紹介したいと思います。
バリューコマースMyLinkの作り方が知りたい
バリューコマースMyLinkのリンク先がエラー(お探しのページは見つかりません)になってしまう
バリューコマースでMyLinkを作る手順
そもそもMyLinkとは
『MyLink』とは、広告主のサイトから商品画像やリンク先URLを自由に選び、自分で用意した紹介テキストで広告を作成できる機能です。
全ての商品がMyLinkに対応しているわけではないので注意です。商品プログラムの条件のところにMyLink対応か記載してあります。
MyLinkを導入しよう！
まずMyLinkを作成できるように準備する必要があります。
まずバリューコマースにログイン。まだ会員登録していない方はこちら
トップページのメニューバー[ツール]→[LinkSwitch]→[LinkSwitch設定]の順にクリック
「オートMyLinkを利用開始する」をクリック
下の画面に移るのでコードを選択をクリックし、全てのコードをコピーする
コピーしたコードを<head>~</head>内に貼り付ければ、MyLinkをしようできるようになります。([外観]→[テーマエディターまたはテーマ編集]→[header.php])<head>内のどこに貼り付けたら良いかわからない方は、</head>の直前に貼り付ければ間違いありません。
JINテーマを利用している方 WordPress管理画面のHTMLタグ設定【head内】にコードを貼り付け→「変更を保存」をクリックすればOKです。
今回はYahoo!ショッピングを例に作成
まずYahoo!ショッピングと提携する必要があります。審査なしですぐに提携できます。
もしもアフェリエイトでもYahoo!ショッピングのリンクを作成することができますが、バリューコマースの方がほんの少しですが報酬額が高いのでこちらで提携することをおすすめします。
トップページの[広告]→[提携済み]からYahoo!ショッピングを選び、広告素材を選ぶをクリックしましょう。ここまでは通常の広告を作るときと同じです。
広告タイプでMyLinkを選び[再検索]をクリック
下の画面に移るので、「広告主のサイトを見る」から自分の紹介したい商品のページURLをコピー
ページに戻り「コピーしたURLを貼り付ける」にコピーしたURLを貼り付け、「広告となるテキストを入力する」にテキストを入力します。(テキストは「ああ」など適当なもので大丈夫です。)今回Yahoo!で商品リンクの画像は取得しないので、画像URLは空欄にします
MyLinkコードを取得ボタンをクリック。下のような画面になるので「このMyLinkコードを選択」をクリックし全てのコードをコピーします
wordpressのテキストエディタを表示します。css・htmlで「カッテネ」を使用する場合、下のhtmlの【商品のURL】に先ほどコピーしたMyLinkコードを貼り付けます。
プラグインを使用している場合、こちらのショートコードにMyLinkを貼り付けていきます。
ちなみに
htmlとショートコード共に下記の5つのボタンが用意されています。
- 楽天
- Amazon
- Kindle
- 楽天kobo
- audiobook
Yahoo!ショッピングはないので、5つのうちどれかを「Yahoo!ショッピング」の表示に変更します。また使わないボタンはその部分のコードを削除すればOKです。
なぜかMy Linkのリンク先がエラーに
順調に行ったと思ったら
さてテキストエディタにコードを貼り付けてプレビュー画面で確認。
今回はYahoo!ショッピングの他に、楽天・Amazon合わせて3つの商品リンクを作ってみました。
クリックしてサイトに飛ぶか確認してみると。。。
エラー！！！
「ボタンはちゃんと表示されているということは、「カッテネ」が原因ではなくリンクがおかしいということだよね？」
と勝手に解釈しリンクに抜けや重複がないか確認。
どこもおかしいところないな。
ネットで同じような現象がないか確認
1日中答えを探し求めましたが、結局見つからず。
My Linkでリンクを作る際、違う場所に貼っていたのが原因
下の画像の[コメント]部分に注目。Yahoo!ショッピングではMyLinkを作る際、3つURLを貼る場所があります。
- コメントに ※注意 : … と書いてあるもの
- PayPayモール出店ストアと書いてあるもの
- MyLink説明ページはこちらと書いてあるもの
実はこれが原因だったようです。実際に「広告のリンク先URL」を押すとお探しのページは見つかりません。となります。
本当は下の画像のようにMyLink説明ページはこちらと書いてあるものでコードを作らなければいけなかったみたいです。実際に「広告のリンク先URL」を押すとYahoo!ショッピング内のページにいきます。上の画像と同じページにあるので、下にスクロールしていくとこの画面が見つかります。
無事リンク先が表示される
正しい方でコードを作ったら、
無事表示されました！！！
最初から「広告のリンク先URL」を確認しとけばこのミスは起きなかったですね。
ということでリンク先の確認は大事！
まとめ
今回は「カッテネ」を利用している方向けにバリューコマースでMyLinkを作成する方法についてお伝えしました。この記事が参考になれば幸いです。
また別の記事で、楽天・Amazonの商品リンクの作り方も解説しているので参考に▼
ということでこの辺で！
