しかも！
リンクボタンのデザインやレスポンシブ対応（PCとスマホの表示切替）も自動で対応！
パーツを作成したら、JavaScriptのコードを貼り付けるだけなのでとってもカンタンです！
MyLinkBoxで紹介できるカテゴリー
- モール(楽天、Amazonなど)
- 旅行(じゃらん、JTBなど)
- 電子書籍(紀伊国屋書店、楽天Koboなど)
- グルメ(ホットペッパーグルメ)
- 家電(ヤマダ電機、nojimaなど)
- VOD(hulu、U-NEXT)
- アルバイト(タウンワーク、フロムエーなど)
- エンタメ(レコチョク、NEOWINGなど)
- ふるさと納税(さとふる、ふるなびなど)
その「MyLinkBox」のやり方教えてよ！
こんな方におすすめ
- バリューコマースのMyLinkBoxの作成方法を知りたい
MyLinkBoxは様々なカテゴリーから広告主を1度に紹介できる便利パーツ
ASP(アフィリエイトサービスプロバイダー)のバリューコマースより、「MyLinkBox」という機能が2019年6月5日にリリースされました。
「MyLinkBox」は、国内旅行やVODなどの様々なカテゴリーの広告主を1度に紹介できる便利なパーツです。
MyLinkBoxのサンプル
まずは実際に見てもらった方が分かりやすいと思うので、作成したパーツを下記に表示します。
いかがですか？
その他のカテゴリーも見てみたい方はこちらの記事でサンプルを作成しているので、合わせてご覧ください。
-
-
【超便利】バリューコマースMyLinkBoxのカテゴリー別サンプル一覧
MyLinkBoxで商品紹介できる広告主一覧 MyLinkBoxで商品紹介できる広告主一覧は下記の通りです。 カテゴリー 広告主一覧 モール（物販) Yahoo!ショッピング／楽天市場／ ...
続きを見る
このように「ANAインターコンチネンタル石垣リゾート」というホテルを紹介したいとします。
この場合、じゃらん・楽天トラベル・Yahoo！トラベル・JTBといった旅行代理店や旅行サイトを紹介する事が可能です。
MyLinkBoxを設置するまでの流れ
【MyLinkBoxを設置するまでのおおまかな流れ】
step
0バリューコマースにログイン(未会員の方は登録から)
step
1紹介したい商品、表示画像を先に決める(商品名＆画像URLをメモ)
画像検索可能になったので不要！
step
2MyLinkBoxを作成する
step
3MyLinkBoxを自動挿入するためのJavaScriptタグを</head>の直前に追加する（一度だけ)
step
4作成したMyLinkBoxのHTMLタグを記事内に貼る
MyLinkBoxを使用するにはバリューコマースに会員登録が必要
この「MyLinkBox」はバリューコマースが提供しているオリジナルサービスです。
そのため、バリューコマースへ登録しましょう。登録は無料です。
会員登録はこちらから登録できます。
【バリューコマース会員登録までの手順】
step
1メールアドレス登録
step
2会員情報登録
登録完了
バリューコマースについて
バリューコマースは国内で最初にアフィリエイトサービスを提供し始めた信頼あるASP(アフィリエイトサービスプロバイダー)です。
バリューコマースをご存知ない方は、こちらの公式ページで特長をチェックしてみてください。
バリューコマースの特長より、大項目のみ抜粋します。
バリューコマースアフィリエイトの特長
- 大手広告主が多数参加
- 70万サイト以上が選ぶ人気ASP
- 豊富な広告の種類
- 使いやすい管理画面
- 登録無料、手数料ゼロで1,000円から報酬をお支払い
- 満足度95%以上のセミナーでスキルアップ
- バリューコマース アフィリエイトAPI
- 専任担当者が高額報酬獲得をサポート
Yahoo!ショッピングなどのバリューコマースでしか扱っていない広告主があったり、初中級者向けセミナーを開催していたりと、信頼できるASPさんです。
ログインはメールアドレスとパスワードが必要
バリューコマースの会員登録が済んだら、ログインします。
会員登録時のメールアドレスとパスワードを入力してログインしてください。
MyLinkBoxの作成
MyLinkBoxの作成方法について説明します。
MyLinkBox作成前に、紹介したい商品を先に決めた方が良いです。
また、商品画像を掲載する場合はその画像とURLをメモしておくと、MyLinkBox作成がスムーズになります。
MyLinkBox作成画面から画像検索が出来るようになったので、事前に商品画像を決めなくても良くなりました！
ありがとうございます！バリューコマースさん！
MyLinkBox作成画面の説明
最初にMyLinkBox作成画面の説明をします。
それぞれの項目に関して説明します。
| 項目 | 説明 |
|---|---|
| ①MyLinkBox名 | MyLinkBoxに名前を付けます。 分かりやすい名前を付けてください。 |
| ②カテゴリー | 紹介するカテゴリーを選びます。 (モール／国内旅行／電子書籍／グルメ／家電／VOD／アルバイト／エンタメ) |
| ③対象とする都道府県 | カテゴリーが「グルメ」、「アルバイト」の場合のみ使用します。 |
| ④検索キーワード | 入力したキーワードの検索結果を表示します。 「商品名」、「メーカー」、「型番」などを組み合わせます。 |
| ⑤タイトル(商品名) | ここに入力した文字がタイトルとして表示します。 |
| ⑥画像の表示有無 | 画像を掲載するかどうか選択してください。 |
| ⑦画像のURL | 「⑥画像の表示有無」が「あり」の場合、掲載画像のURLを入力します。 画像は、画像使用可のサイト＆表示順1に設定した画像を使用します。 ※方法は後述します。 |
| ⑧ユーザー向けお得情報の表示有無 | ユーザー向けのお得情報がある場合、自動で表示してくれます。 |
| ⓽表示する広告主を選択する | 表示する広告主を選択します。 商品画像を使用する場合、画像を使用するサイトを表示順1に設定します。 |
| ⑩プレビュー | 作成したMyLinkBoxを確認できます。 デスクトップとスマートフォンの2パターンの確認が可能です。 |
| ⑪検索キーワードを使用せずに、個別にリンク先を設定する | 【設定しない】上記で記入した検索キーワードに基づく検索結果を表示します。
【設定する】サイト毎に商品詳細URLを設定する場合に設定します。 |
MyLinkBoxで紹介できる広告主一覧(2019年6月10日時点)
MyLinkBoxはカテゴリーが分かれており、カテゴリー毎に紹介できる広告主さんが異なります。
| カテゴリー | 広告主一覧 |
|---|---|
| モール（物販) |  ／ |
| 国内旅行 | |
| 電子書籍 | |
| グルメ | ホットペッパーグルメ |
| 家電 | |
| VOD | |
| アルバイト | |
| エンタメ | |
| ふるさと納税 |
ですが1度作れば慣れると思うので、一緒に「ANAインターコンチネンタル石垣リゾート」を作成してみましょう！
「ANAインターコンチネンタル石垣リゾート」を紹介するMyLinkBoxを一緒に作ろう！
サンプルとして「国内旅行」カテゴリーから「ANAインターコンチネンタル石垣リゾート」の紹介パーツを作りましょう。
ここで改めて、MyLinkBoxを設置するまでの流れを下記に説明します。
step
1紹介したい商品、表示画像を先に決める(商品名＆画像URLをメモ)
画像検索可能になったので不要！
step
2MyLinkBoxを作成する
step
3MyLinkBoxを自動挿入するためのJavaScriptタグを</head>の直前に追加する（一度だけ)
step
4作成したMyLinkBoxのHTMLタグを記事内に貼る
MyLinkBoxで掲載できる画像の条件は、画像使用可の広告主＆表示順1の広告主
MyLinkBoxで掲載する画像の使用条件として、下記があります。
MyLinkBoxに掲載可能な画像の条件
- 画像使用可能な広告主
- 表示順1の広告主の画像を使用
「1.画像使用可能な広告主」について、広告主サイトの画像を使用して良いかどうかは、広告主さんによって異なります。
画像使用可否を調べる場合、「MyLink」広告という広告素材ページに掲載されています。 ※今回作成する「MyLinkBox」とは別の広告です。
「MyLink」広告とは、リンク先や広告用画像を広告主サイトから自由に選択できる広告です。
「2.表示順1の広告主の画像を使用」については、下記のMyLinkBox作成画面でのプレビュー画面で説明します。
上記プレビュー画面での表示順は下記の通りです。
- じゃらん
- Yahoo!トラベル
- 楽天トラベル
- JTB
MyLinkBoxのボタン表示では左上のボタン(じゃらん)が表示順1の広告主となります。
そのため、画像を掲載する場合には、じゃらんが提供している画像を使用する必要があります。
しかし、じゃらんが広告に画像を使用して良いかどうかを調べる必要があります。
MyLinkBox作成画面から商品画像を検索＆使用して良いかどうか確認出来るようになりました！
MyLink広告にて画像使用可能か調べられる(MyLinkBox作成画面から画像検索可能になったため不要)
MyLinkBox作成画面から商品画像を検索＆使用して良いかどうか確認できるようになったため、この手順は不要です。
今回は例として、宿・ホテル予約サイトの「じゃらん」が、広告として画像を使用かどうかを調べます。
バリューコマースログイン後のトップ画面で「じゃらん」と検索します。
広告主が表示されたら、【広告素材を選ぶ】をクリックします。
次に画面左の広告タイプを「MyLink」を選択し、【再検索】ボタンを押します。
下へスクロールすると、下記のような項目があります。
| 画像の使用 | 可 | 広告主サイト内の画像を使用可能。 |
|---|---|---|
| 不可 | 広告主サイト内の画像は使用不可。 | |
| 画像の保存先 | 広告主側 | 画像URLが広告主のまま使用することが可能。 |
| アフィリエイトサイト側 | 広告主にある画像をダウンロード、アクセスできる場所に保存して使用。 | |
| 画像サイズの変更 | 可 | MyLinkで使用した画像のリサイズが可能(縦横比率は変更不可) |
| 不可 | 画像サイズの変更不可。 |
【参考】バリューコマース：「MyLinkとは何ですか？注意事項はありますか？」
じゃらんの場合、画像使用可、画像保存先は広告主のため、画像URLをそのまま使用することができます。
そうしたら広告主のリンク先URLへ移動しましょう。
注意として、広告の種類や遷移するURL先によっては、画像使用可否が異なる場合があります。
広告主ページから商品名を調べる(MyLinkBox作成画面から画像検索可能になったため不要)
MyLinkBox作成画面から商品画像を検索＆使用して良いかどうか確認できるようになったため、この手順は不要です。
移動したじゃらんのページから「ANAインターコンチネンタル石垣リゾート」を検索します。
検索すると素敵な画像がたくさん出てくると思います。
掲載したい画像を決めたら、画像の上で右クリック→画像アドレスをコピーして画像URLを取得します。
※ブラウザがChromeの場合
商品広告名と画像URLはMyLinkBox作成時に使用するので、メモしておいてください。
MyLinkBoxの新規作成（便利ツール→MyLinkBox→新規作成から)
【便利ツール】をクリックした後、【MyLinkBox】にマウスポインターを合わせ、【新規作成】をクリックします。
MyLinkBoxの必要事項を記入
MyLinkBoxの必要事項を記入していきます。
まず最初に「カテゴリー」を選んでから、その他の項目を記入した方が良いでしょう。
| 項目 | サンプル記入 |
|---|---|
| ①MyLinkBox名 | MyLinkBox_ANAインターコンチネンタル石垣リゾート |
| ②カテゴリー | 国内旅行 |
| ③対象とする都道府県 | 未記入(カテゴリーが「グルメ」、「アルバイト」の場合のみ) |
| ④検索キーワード | インターコンチネンタル石垣リゾート |
| ⑤タイトル(商品名) | 【この夏オススメ！】ANAインターコンチネンタル石垣リゾート |
| ⑥画像の表示有無 | あり |
| ⑦画像のURL | ※コピーした画像アドレスを入力 |
| ⑧ユーザー向けお得情報の表示有無 | 表示する |
| ⓽表示する広告主を選択する | 表示する広告主の順番を選びます。 今回は「じゃらん」の画像を使用するので、「じゃらん」を表示順1にしてください。 |
| ⑩プレビュー | プレビューを確認してください。 「⑦画像のURL」が正しければ、リアルタイムでプレビューに表示されます。 |
| ⑪検索キーワードを使用せずに、個別にリンク先を設定する | 【設定しない】 ※検索キーワードに基づく検索結果を表示します。 |
まず「②カテゴリー」から先に選んでください。カテゴリーは国内旅行になりますね。
「①MyLinkBox」は自分が分かりやすい名前に設定してください。
「③対象とする都道府県」は、カテゴリーが「グルメ」と「アルバイト」の場合のみ使用するので、今回は対象外です。
「④検索キーワード」は実際に商品を検索したキーワードを記入すると良いでしょう。
今回は「インターコンチネンタル石垣リゾート」としました。
「⑤タイトル(商品名)」には、MyLinkBoxに表示させたいタイトルになります。
「④検索キーワード」と区別するため、「【この夏オススメ！】ANAインターコンチネンタル石垣リゾート」にしました。
「⑥画像の表示有無＆⑦画像のURL」ですが、最初にメモしておいた画像アドレスをここに記入します。
この画像アドレスが正しければ、プレビュー画面でリアルタイムに表示されるので、正しい画像か確認してください。
ここで紹介したい画像を検索できるようになりました！
今までは掲載可能な広告主さんから商品画像のURLをコピペする必要がありましたが、画像検索可能になったのでとっても便利！
その手順を説明しますね。
■MyLinkBoxで商品画像を検索して表示する方法
- 検索したい商品を入力
- 検索ボタンをクリック
- 検索したキーワードの画像が表示されるので、掲載したい画像をクリック
- MyLinkBoxのプレビュー画面に反映されるので確認する
とても楽になりましたね！
続いて、「⑧ユーザー向けお得情報の表示有無」を選びます。
「⑧ユーザー向けお得情報の表示有無」は表示するにしました。
特に理由がない限りはお得情報が合った方が嬉しいですよね。
「⑨表示する広告主を選択する」について、画像アドレスを使用する場合は、使用するサイトを表示順1に設定してください。
表示順の入れ替えは、入れ替えたい広告主をドラッグ＆ドロップします。
移動すると、プレビュー画面がリアルタイムに入れ替わりますよ。
今回は「⑪検索キーワードを使用せずに、個別にリンク先を設定する」は設定しないようにします。
例えばじゃらんではこのページ、Yahoo!トラベルでのこのページというように個別で設定したい場合には「設定する」で個別ページを指定します。
全て記入が終わったら、【MyLinkBox作成】ボタンを押してください。
ひとまず完成！！
もう少しで表示できるようになるので、頑張ってください！
step
3MyLinkBoxを自動挿入するためのJavaScriptタグをheaderに追加する（一度だけ)
step
4作成したMyLinkBoxのHTMLタグを記事内に貼る
MyLinkBoxを自動挿入するためのJavaScriptタグを</head>の直前に追加する(一度だけ)
MyLinkBoxを自動挿入するため、上記の赤い部分のjavaScriptタグを</head>の直前に追加します。
この作業は1度だけ行えば、追加のMyLinkBoxでは不要です。
<head></head>への追加はWordPressで説明します。
なお、お使いのテーマによって<head></head>の場所は異なります。
詳細はお使いのテーマのマニュアル等を参照してください。
WordPressの「外観」⇒「テーマエディタ―」をクリックします。
テーマエディタ―に入ったら、テーマファイルから「header.php」というファイルを探します。
「header.php」が見つかったらクリックします。
header.phpファイルに入ったら、</head>部分を検索します。
Ctrl キー + F キー
を押して、検索機能を表示します。
</head>
と入力すると、</head>が見つかります。
この直前にMyLinkBox作成後に表示されたJavaScriptコード(赤く囲った部分)を追加します。
追加したら【ファイルを更新】ボタンを押してください。
作成したMyLinkBoxのHTMLタグを記事内に貼る
最後に作成したMyLinkBoxのHTMLタグを記事内に貼ります。
テキストエディタに切り替えてください。
テキストエディタに切り替えたら、緑枠で囲ったHTMLタグを表示させたい位置に記述します。
MyLinkBoxを作成してすぐの場合、表示されるまでに時間がかかります。
表示されるまで少々お待ちください。
作成したMyLinkBoxは下記のように表示されます。
MyLinkBox使用時の注意事項
MyLinkBoxのHTMLタグをテキストエディタで貼った後、ビジュアルエディタに切り替えると、WordPressの自動整形機能により、正常に動作しなくなります。
対策法については、後日追記予定です。
【テキストエディタからビジュアルエディタに切り替えたときにHTMLタグを自動整形させない方法】
- テキストエディタからビジュアルエディタに切り替えない【簡単】
- functins.phpなどに自動整形防止の機能を追加する
まとめ
今回はバリューコマースより2019年6月5日に新しく公開された「MyLinkBox」の作成方法と設置方法について説明しました。
MyLinkBoxを使うことで、物販以外の商品でも複数の広告主を紹介できるので便利です。
会員登録はこちらから登録できます。
「MyLinkBox」を使って、素敵な商品を紹介してください！
[st_af name="vc"]
