【トマレバの使い方】旅行系アフィリエイトの効率UP!カスタマイズの方法も解説します

旅行系アフィリエイター

宿予約のアフィリエイトをしているが、いつも旅行会社ごとに一つ一つリンクを貼っているので、非常に手間がかかっている。なんか「トマレバ」ってやつを使うと効率的らしいけど、どう使うの?

こんにちは、リュウセイです。

宿予約のアフィリエイトには、「じゃらん」や「楽天トラベル」など様々な旅行会社があり、記事を書く度にそれら一つ一つのリンクを貼っていくのはかなり面倒です。

手動でリンクを貼っていると、「リンクを貼り忘れていたから、もしかしたら成約を取りこぼしてしまったかも…」というケースも起こり得ますよね。

そこでぜひ使ってほしいのが、「トマレバ」というツール。

トマレバを使えば、

  • 複数の旅行会社のアフィリリンクをまとめて貼れる
  • ブログパーツにできるので使いやすい&見栄えが良い
  • リンクの貼り忘れによる成約取りこぼしを防げる
  • 「再利用ブロック」に追加することで効率がグッと上がる

上記のことが可能になります。

トマレバを使うと、以下のようなブログパーツを作成できるので便利ですよ。

無料で使えるので、使わなきゃ損!

これから旅行系アフィリエイトを始めたいというブロガーの方にも、「トマレバ」は非常におすすめのツールです。

それでは、トマレバの使い方について解説していきますね。

トマレバを使うのに必要な提携先の広告主とアフィリエイトASP

トマレバはアフィリエイト用ツールなので、アフィリエイトASPの登録が必要不可欠です。

トマレバを利用するのに必要な広告主は以下の通りです。

  • 楽天トラベル
  • じゃらん
  • JTB
  • 近畿日本ツーリスト(knt)
  • 一休
  • るるぶ
  • Yahoo!トラベル

そしてこれらの広告主と提携できるアフィリエイトASPは以下の通りです。

  • もしもアフィリエイトor楽天アフィリエイト
    →楽天トラベル
  • バリューコマース
    →じゃらん、JTB、近畿日本ツーリスト(knt)、一休、るるぶ、Yahoo!トラベル

上記の通り、「もしもアフィリエイトor楽天アフィリエイト」と「バリューコマース」への登録だけでOKです。

楽天アフィリエイトの報酬は楽天ポイントで支払われるため、現金がいいという方はもしもアフィリエイトから提携しましょう。

バリューコマースはちょい審査が厳しいので頑張ってください。

トマレバの使い方

アフィリエイトASPの登録が終わったら、次はASPから「アフィリエイトID」を取得しましょう。

アフィリエイトIDの取得について、詳しく解説していきます。

もしもアフィリエイトからアフィリエイトIDを取得する手順

もしもアフィリエイト(または楽天アフィリエイト)からは、「楽天トラベル」のアフィリエイトIDを取得していきます。

もしもアフィリエイトにログインして、検索窓に「楽天トラベル」と入力して検索しましょう。

もしもアフィリエイトからアフィリエイトIDを取得する手順1

「提携申請する」をクリック。

もしもアフィリエイトからアフィリエイトIDを取得する手順2

「広告リンク取得」をクリック。

もしもアフィリエイトからアフィリエイトIDを取得する手順3

ソースコード内の「id=●●」の「●●」をコピー。

もしもアフィリエイトからアフィリエイトIDを取得する手順4

この●●がアフィリエイトIDとなります。

以上がもしもアフィリエイトでのID取得の手順です。

もしもアフィリエイトには「W報酬」制度があり、旨味が大きいのでオススメです!審査もそこまで難しくないので、もしもアフィリエイトで登録しましょう!

バリューコマースアフィリエイトIDを取得する手順

続いて、バリューコマースのアフィリエイトID取得手順です。

バリューコマースにログインして、検索窓に「じゃらん」と入力して検索しましょう。

バリューコマースアフィリエイトIDを取得する手順1

「広告素材を選ぶ」をクリック。

バリューコマースアフィリエイトIDを取得する手順2

「同意」をクリック。

バリューコマースアフィリエイトIDを取得する手順3

「提携済み」と出ていることを確認する。

バリューコマースアフィリエイトIDを取得する手順4

下にスクロールすると「MyLink」の項目があるので、「広告主のサイトを見る」をクリック。

バリューコマースアフィリエイトIDを取得する手順5

広告主のトップページURLをコピー。

バリューコマースアフィリエイトIDを取得する手順6

URLを貼り付けて「MyLinkコードを取得」をクリック(ID取得が目的なのでテキストは適当でOK)。

バリューコマースアフィリエイトIDを取得する手順7

ソースコード内の「sid=●●」「pid=●●」それぞれの「●●」をコピー。

バリューコマースアフィリエイトIDを取得する手順8

以上がバリューコマースでのID取得の手順です。

残りのJTB、近畿日本ツーリスト(knt)、一休、るるぶ、Yahoo!トラベルも同様にID取得してください。

JTBのアフィリエイトID取得
近畿日本ツーリスト(knt)のアフィリエイトID取得
一休のアフィリエイトIDの取得
るるぶのアフィリエイトIDの取得
Yahoo!トラベルのアフィリエイトID取得

ちなみに、ASPで広告主を検索する際は、広告主名を一語一句間違わずに入力してください。

例えば、Yahoo!トラベルは「yahooトラベル」で検索すると候補に引っかかりません。

同じく、近畿日本ツーリスト(knt)も「近畿日本ツーリスト」か「knt」で検索するようにしてください。

一語一句間違わずに入力しなきゃ引っかからないの、面倒よね。いつか改善されるかな?

トマレバにアフィリエイトIDを登録する

アフィリエイトIDを取得したら、トマレバに登録していきます。

トマレバにアクセスして下にスクロールしていくと「ユーザーデーター入力」の項目があるので、そこへ先ほど取得したIDを貼り付けていきます。

トマレバにアフィリエイトIDを登録する手順1

全ての入力が終わったら「保存」をクリックして終了です。

トマレバにアフィリエイトIDを登録する手順2

ユーザーデータは一度入力して保存しておけばそのままデータが残るので、データ入力は最初の一回だけでOKです。

でもしばらくログインしていないとデータが消えるらしい(実体験)。

ブログにトマレバのブログパーツを貼り付けよう

これで、トマレバを使うための下準備(ID取得&登録)は全て完了です。

ここからはブログパーツを作成して、パーツのHTMLを取得していく作業です。

トマレバのヘッダーにある検索窓へ宿・ホテル名キーワードを入力して検索しましょう。

「ブログパーツを作る」をクリック。

ブログパーツのHTMLをコピー。

後はこのHTMLをブログにコピペすればOKです。

貼ってみるとこんな仕上がりになります。

「再利用ブロック」に追加しておけばアフィリエイトが捗りますね!

トマレバのカスタマイズ方法

今回はCSSデザインのものを選択しましたが、これを実装するにはテーマの「style.css」へコードを記述する必要があります。

以下のコードを「style.css」の一番下に記述すれば動作します。
コードはコチラのサイトから引用してきました。

<div class="hidden_box"><input id="label1" type="checkbox"><br><label for="label1">クリックして表示</label>
<p>&nbsp;</p>
<div class="hidden_show">
<p><!--非表示ここから--></p>
[box class="blue_box"]
<p>/*--------------------------------------------------<br>カエレバ・ヨメレバ・トマレバ WordPressの場合<br>---------------------------------------------------*/</p>
<p>.cstmreba {<br>width: 98%;<br>height:auto;<br>margin:36px 0;<br>font-family:'Lucida Grande','Hiragino Kaku Gothic ProN',Helvetica, Meiryo, sans-serif;<br>line-height: 1.5;<br>word-wrap: break-word;<br>box-sizing: border-box;<br>display: block;<br>}<br>.cstmreba a {<br>transition: 0.8s ;<br>color:#285EFF; /* テキストリンクカラー */<br>}<br>.cstmreba a:hover {<br>color:#FFCA28; /* テキストリンクカラー(マウスオーバー時) */<br>}<br>.cstmreba .booklink-box,.cstmreba .kaerebalink-box,.cstmreba .tomarebalink-box {<br>width: 100%;<br>background-color: #fff; /* 全体の背景カラー */<br>overflow: hidden;<br>border:double #d2d7e6;<br>border-radius: 5px;<br>box-sizing: border-box;<br>padding: 12px 8px;<br>}<br>/* サムネイル画像ボックス */<br>.cstmreba .booklink-image,<br>.cstmreba .kaerebalink-image,<br>.cstmreba .tomarebalink-image {<br>width:150px;<br>float:left;<br>margin:0 14px 0 0;<br>text-align: center;<br>}<br>.cstmreba .booklink-image a,<br>.cstmreba .kaerebalink-image a,<br>.cstmreba .tomarebalink-image a {<br>width:100%;<br>display:block;<br>}<br>/* サムネイル画像 */<br>.cstmreba .booklink-image a img,.cstmreba .kaerebalink-image a img,.cstmreba .tomarebalink-image a img {<br>margin:0 auto;<br>padding: 0;<br>text-align:center;<br>}<br>.cstmreba .booklink-info,.cstmreba .kaerebalink-info,.cstmreba .tomarebalink-info {<br>overflow:hidden;<br>line-height:170%;<br>color: #333;<br>}<br>/* infoボックス内リンク下線非表示 */<br>.cstmreba .booklink-info a,<br>.cstmreba .kaerebalink-info a,<br>.cstmreba .tomarebalink-info a {<br>text-decoration: none;<br>}<br>/* 作品・商品・ホテル名 リンク */<br>.cstmreba .booklink-name&gt;a,<br>.cstmreba .kaerebalink-name&gt;a,<br>.cstmreba .tomarebalink-name&gt;a {<br>border-bottom: 1px dotted ;<br>font-size:16px;<br>}<br>/* タイトル下にPタグ自動挿入された際の余白を小さく */<br>.cstmreba .kaerebalink-name p,<br>.cstmreba .booklink-name p,<br>.cstmreba .tomarebalink-name p {<br>margin: 0;<br>}<br>/* powered by */<br>.cstmreba .booklink-powered-date,<br>.cstmreba .kaerebalink-powered-date,<br>.cstmreba .tomarebalink-powered-date {<br>font-size:10px;<br>line-height:150%;<br>}<br>.cstmreba .booklink-powered-date a,<br>.cstmreba .kaerebalink-powered-date a,<br>.cstmreba .tomarebalink-powered-date a {<br>border-bottom: 1px dotted ;<br>color: #333;<br>}<br>.cstmreba .booklink-powered-date a:hover,<br>.cstmreba .kaerebalink-powered-date a:hover,<br>.cstmreba .tomarebalink-powered-date a:hover {<br>color:#333;<br>}<br>/* 著者・住所 */<br>.cstmreba .booklink-detail,.cstmreba .kaerebalink-detail,.cstmreba .tomarebalink-address {<br>font-size:12px;<br>}<br>.cstmreba .kaerebalink-link1 img,.cstmreba .booklink-link2 img,.cstmreba .tomarebalink-link1 img {<br>display:none !important;<br>}<br>.cstmreba .kaerebalink-link1,.cstmreba .booklink-link2,.cstmreba .tomarebalink-link1 {<br>display: inline-block;<br>width: 100%;<br>margin-top: 5px;<br>}<br>.cstmreba .booklink-link2&gt;div,<br>.cstmreba .kaerebalink-link1&gt;div,<br>.cstmreba .tomarebalink-link1&gt;div {<br>float:left;<br>width:31%;<br>min-width:125px;<br>margin:0.5% 1%;<br>}<br>/***** ボタンデザインここから ******/<br>.cstmreba .booklink-link2 a,<br>.cstmreba .kaerebalink-link1 a,<br>.cstmreba .tomarebalink-link1 a {<br>width: 100%;<br>display: inline-block;<br>text-align: center;<br>box-sizing: border-box;<br>font-size: 13px;<br>font-weight: bold;<br>line-height: 180%;<br>padding:3% 1%;<br>margin: 1px 0;<br>border-radius: 4px;<br>box-shadow: 0 2px 0 #ccc;<br>background: -moz-linear-gradient(top,#fafafa,#EEE);<br>background: -webkit-gradient(linear, left top, left bottom, from(#fafafa), to(#eee));<br>}<br>.cstmreba .booklink-link2 a:hover,<br>.cstmreba .kaerebalink-link1 a:hover,<br>.cstmreba .tomarebalink-link1 a:hover {<br>text-decoration: underline;<br>}<br>/* トマレバ */<br>.cstmreba .tomarebalink-link1 .shoplinkrakuten a { color: #76ae25; }/* 楽天トラベル */<br>.cstmreba .tomarebalink-link1 .shoplinkjalan a { color: #ff7a15; }/* じゃらん */<br>.cstmreba .tomarebalink-link1 .shoplinkjtb a { color: #c81528; }/* JTB */<br>.cstmreba .tomarebalink-link1 .shoplinkknt a { color: #0b499d; }/* KNT */<br>.cstmreba .tomarebalink-link1 .shoplinkikyu a { color: #bf9500; }/* 一休 */<br>.cstmreba .tomarebalink-link1 .shoplinkrurubu a { color: #000066; }/* るるぶ */<br>.cstmreba .tomarebalink-link1 .shoplinkyahoo a { color: #ff0033; }/* Yahoo!トラベル */<br>/* カエレバ */<br>.cstmreba .kaerebalink-link1 .shoplinkyahoo a {color:#ff0033; letter-spacing:normal;} /* Yahoo!ショッピング */<br>.cstmreba .kaerebalink-link1 .shoplinkbellemaison a { color:#84be24 ; } /* ベルメゾン */<br>.cstmreba .kaerebalink-link1 .shoplinkcecile a { color:#8d124b; } /* セシール */<br>.cstmreba .kaerebalink-link1 .shoplinkkakakucom a {color:#314995;} /* 価格コム */<br>/* ヨメレバ */<br>.cstmreba .booklink-link2 .shoplinkkindle a { color:#007dcd;} /* Kindle */<br>.cstmreba .booklink-link2 .shoplinkrakukobo a{ color:#d50000; } /* 楽天kobo */<br>.cstmreba .booklink-link2 .shoplinkbk1 a { color:#0085cd; } /* honto */<br>.cstmreba .booklink-link2 .shoplinkehon a { color:#2a2c6d; } /* ehon */<br>.cstmreba .booklink-link2 .shoplinkkino a { color:#003e92; } /* 紀伊國屋書店 */<br>.cstmreba .booklink-link2 .shoplinktoshokan a { color:#333333; } /* 図書館 */<br>/* カエレバ・ヨメレバ共通 */<br>.cstmreba .kaerebalink-link1 .shoplinkamazon a,<br>.cstmreba .booklink-link2 .shoplinkamazon a { color:#FF9901; } /* Amazon */<br>.cstmreba .kaerebalink-link1 .shoplinkrakuten a ,<br>.cstmreba .booklink-link2 .shoplinkrakuten a { color: #c20004; } /* 楽天 */<br>.cstmreba .kaerebalink-link1 .shoplinkseven a,<br>.cstmreba .booklink-link2 .shoplinkseven a { color:#225496;} /* 7net */<br>/***** ボタンデザインここまで ******/<br>.cstmreba .booklink-footer {<br>clear:both;<br>}<br>/*** 解像度480px以下のスタイル ***/<br>@media screen and (max-width:480px){<br>.cstmreba .booklink-image,<br>.cstmreba .kaerebalink-image,<br>.cstmreba .tomarebalink-image {<br>width:100%;<br>float:none;<br>}<br>.cstmreba .booklink-link2&gt;div,<br>.cstmreba .kaerebalink-link1&gt;div,<br>.cstmreba .tomarebalink-link1&gt;div {<br>width: 95%;<br>margin: 0 auto 8px auto;<br>float:none;<br>}<br>.cstmreba .booklink-info,<br>.cstmreba .kaerebalink-info,<br>.cstmreba .tomarebalink-info {<br>text-align:center;<br>padding-bottom: 1px;<br>}<br>}<br>/*--------------------------------------------------<br>ボタンの背景色をRinker風にカスタマイズ<br>---------------------------------------------------*/</p>
<p>.cstmreba .kaerebalink-link1 .shoplinkrakuten a, .cstmreba .booklink-link2 .shoplinkrakuten a {<br>color: #fff;<br>background: #cf4944 !important;<br>}<br>.cstmreba .kaerebalink-link1 .shoplinkamazon a, .cstmreba .booklink-link2 .shoplinkamazon a {<br>color: #fff;<br>background: #f6a306 !important;<br>}<br>.cstmreba .kaerebalink-link1 .shoplinkyahoo a {<br>color: #fff;<br>background: #51a7e8 !important;<br>}</p>
[/box]
<p><!--ここまで--></p>
</div>
</div>

ちなみに、CSSやJavaScriptなどのコードは圧縮させることが可能で、コード呼び出しがスムーズになりサイト表示速度への負担を軽く出来ます。

CSS Minifier (スタイルシートの圧縮)」でコードの圧縮が可能なので、良ければ試してみてください。

上記のCSSを圧縮したものがコチラです。

<div class="hidden_box"><input id="label2" type="checkbox"><br><label for="label2">クリックして表示</label>
<p>&nbsp;</p>
<div class="hidden_show">
<p><!--非表示ここから--></p>
[box class="blue_box"]
<p>.cstmreba{width:98%;height:auto;margin:36px 0;font-family:Lucida Grande,Hiragino Kaku Gothic ProN,Helvetica,Meiryo,sans-serif;line-height:1.5;word-wrap:break-word;box-sizing:border-box;display:block}.cstmreba a{transition:.8s;color:#285eff}.cstmreba a:hover{color:#ffca28}.cstmreba .booklink-box,.cstmreba .kaerebalink-box,.cstmreba .tomarebalink-box{width:100%;background-color:#fff;overflow:hidden;border:double #d2d7e6;border-radius:5px;box-sizing:border-box;padding:9pt 8px}.cstmreba .booklink-image,.cstmreba .kaerebalink-image,.cstmreba .tomarebalink-image{width:150px;float:left;margin:0 14px 0 0;text-align:center}.cstmreba .booklink-image a,.cstmreba .kaerebalink-image a,.cstmreba .tomarebalink-image a{width:100%;display:block}.cstmreba .booklink-image a img,.cstmreba .kaerebalink-image a img,.cstmreba .tomarebalink-image a img{margin:0 auto;padding:0;text-align:center}.cstmreba .booklink-info,.cstmreba .kaerebalink-info,.cstmreba .tomarebalink-info{overflow:hidden;line-height:170%;color:#333}.cstmreba .booklink-info a,.cstmreba .kaerebalink-info a,.cstmreba .tomarebalink-info a{text-decoration:none}.cstmreba .booklink-name&gt;a,.cstmreba .kaerebalink-name&gt;a,.cstmreba .tomarebalink-name&gt;a{border-bottom:1px dotted;font-size:1pc}.cstmreba .booklink-name p,.cstmreba .kaerebalink-name p,.cstmreba .tomarebalink-name p{margin:0}.cstmreba .booklink-powered-date,.cstmreba .kaerebalink-powered-date,.cstmreba .tomarebalink-powered-date{font-size:10px;line-height:150%}.cstmreba .booklink-powered-date a,.cstmreba .kaerebalink-powered-date a,.cstmreba .tomarebalink-powered-date a{border-bottom:1px dotted;color:#333}.cstmreba .booklink-powered-date a:hover,.cstmreba .kaerebalink-powered-date a:hover,.cstmreba .tomarebalink-powered-date a:hover{color:#333}.cstmreba .booklink-detail,.cstmreba .kaerebalink-detail,.cstmreba .tomarebalink-address{font-size:9pt}.cstmreba .booklink-link2 img,.cstmreba .kaerebalink-link1 img,.cstmreba .tomarebalink-link1 img{display:none!important}.cstmreba .booklink-link2,.cstmreba .kaerebalink-link1,.cstmreba .tomarebalink-link1{display:inline-block;width:100%;margin-top:5px}.cstmreba .booklink-link2&gt;div,.cstmreba .kaerebalink-link1&gt;div,.cstmreba .tomarebalink-link1&gt;div{float:left;width:31%;min-width:125px;margin:.5% 1%}.cstmreba .booklink-link2 a,.cstmreba .kaerebalink-link1 a,.cstmreba .tomarebalink-link1 a{width:100%;display:inline-block;text-align:center;box-sizing:border-box;font-size:13px;font-weight:700;line-height:180%;padding:3% 1%;margin:1px 0;border-radius:4px;box-shadow:0 2px 0 #ccc;background:-moz-linear-gradient(top,#fafafa,#eee);background:-webkit-gradient(linear,left top,left bottom,from(#fafafa),to(#eee))}.cstmreba .booklink-link2 a:hover,.cstmreba .kaerebalink-link1 a:hover,.cstmreba .tomarebalink-link1 a:hover{text-decoration:underline}.cstmreba .tomarebalink-link1 .shoplinkrakuten a{color:#76ae25}.cstmreba .tomarebalink-link1 .shoplinkjalan a{color:#ff7a15}.cstmreba .tomarebalink-link1 .shoplinkjtb a{color:#c81528}.cstmreba .tomarebalink-link1 .shoplinkknt a{color:#0b499d}.cstmreba .tomarebalink-link1 .shoplinkikyu a{color:#bf9500}.cstmreba .tomarebalink-link1 .shoplinkrurubu a{color:#006}.cstmreba .tomarebalink-link1 .shoplinkyahoo a{color:#f03}.cstmreba .kaerebalink-link1 .shoplinkyahoo a{color:#f03;letter-spacing:normal}.cstmreba .kaerebalink-link1 .shoplinkbellemaison a{color:#84be24}.cstmreba .kaerebalink-link1 .shoplinkcecile a{color:#8d124b}.cstmreba .kaerebalink-link1 .shoplinkkakakucom a{color:#314995}.cstmreba .booklink-link2 .shoplinkkindle a{color:#007dcd}.cstmreba .booklink-link2 .shoplinkrakukobo a{color:#d50000}.cstmreba .booklink-link2 .shoplinkbk1 a{color:#0085cd}.cstmreba .booklink-link2 .shoplinkehon a{color:#2a2c6d}.cstmreba .booklink-link2 .shoplinkkino a{color:#003e92}.cstmreba .booklink-link2 .shoplinktoshokan a{color:#333}.cstmreba .booklink-link2 .shoplinkamazon a,.cstmreba .kaerebalink-link1 .shoplinkamazon a{color:#ff9901}.cstmreba .booklink-link2 .shoplinkrakuten a,.cstmreba .kaerebalink-link1 .shoplinkrakuten a{color:#c20004}.cstmreba .booklink-link2 .shoplinkseven a,.cstmreba .kaerebalink-link1 .shoplinkseven a{color:#225496}.cstmreba .booklink-footer{clear:both}@media screen and (max-width:480px){.cstmreba .booklink-image,.cstmreba .kaerebalink-image,.cstmreba .tomarebalink-image{width:100%;float:none}.cstmreba .booklink-link2&gt;div,.cstmreba .kaerebalink-link1&gt;div,.cstmreba .tomarebalink-link1&gt;div{width:95%;margin:0 auto 8px;float:none}.cstmreba .booklink-info,.cstmreba .kaerebalink-info,.cstmreba .tomarebalink-info{text-align:center;padding-bottom:1px}}.cstmreba .booklink-link2 .shoplinkrakuten a,.cstmreba .kaerebalink-link1 .shoplinkrakuten a{color:#fff;background:#cf4944!important}.cstmreba .booklink-link2 .shoplinkamazon a,.cstmreba .kaerebalink-link1 .shoplinkamazon a{color:#fff;background:#f6a306!important}.cstmreba .kaerebalink-link1 .shoplinkyahoo a{color:#fff;background:#51a7e8!important}</p>
[/box]
<p><!--ここまで--></p>
</div>
</div>

どちらを使っても大丈夫ですよ(動作確認済み)。

なおトマレバと同じ開発者のツールとして「カエレバ」「ヨメレバ」「ポチレバ」「タベレバ」がありますが、上記CSSはその全てのツールで動作するので、一つ記述しておけば大丈夫です。

コードが長いので、トマレバのカスタマイズ用CSSファイルを専用で作って、それを記事ごとに読み込ませるようにした方がいいかもですね。

それでは、以上です。
ありがとうございました。

コメントを残す

メールアドレスが公開されることはありません。 が付いている欄は必須項目です