人気ワード

Copy Title & URL

Bookmark

Feed

Share

BASE(ベイス)とアフィリコード・システムの連携方法

BASE(ベイス)とアフィリコード・システムの連携方法

本記事では無料で簡単にネットショップが開設できる「BASE」とアフィリコード・システムとの成果連携方法に関する解説をおこないます。

BASEに関してはすでにショップの開設が完了していることを前提にすすめていきますので、開設がまだの方は先にショップ設定を行ってください。

無料ネットショップ開業【BASE】 はこちら

BASEとアフィリコード・システムの連携フローは以下の通りとなります。

BASEとアフィリコード・システムの連携フロー

BASEとの連携に関して、以下の注意点があります。

  • PHPファイルのアップロードが出来ないため、JSタグのみ対応可能
  • ITP制限がかかっている場合、広告クリックから「1週間」以内での購入が必要
  • BASE側で独自ドメインを利用する場合は連携不可
    ※ https//○○○○.thebase.in というドメインの場合に限り連携可能

アフィリコード・システム側の設定

まずアフィリコード・システム側からの設定を解説します。

BASEのネットショップは商品ページとカートページのドメインがサブドメインで遷移する仕様となっています。そのため、取得したJSタグに対してドメイン指定を行う必要があります。
クロスドメイン(サブドメイン)時のタグ設定方法記事を参照

当該広告詳細画面から、「JSタグ(ITP対応)」を選択し、JSタグ(着地点)を以下のように編集します。

変更前着地点タグ

<script>
var _CIDN = "cid";
var _PMTN = "p";
var _param = location.search.substring(1).split("&");
var _ulp = "", _ulcid = "";
for(var i = 0; _param[i]; i++){ var kv = _param[i].split("="); if(kv[0] == _PMTN && kv[1].length > 1){ _ulp = kv[1]; } if(kv[0] == _CIDN && kv[1].length > 1){ _ulcid = kv[1]; }}
if(_ulp && _ulcid){ document.cookie = "CL_" + _ulp + "=" + decodeURIComponent(_ulcid) + "; expires=" + new Date(new Date().getTime() + (63072000000)).toUTCString() + "; path=/;"; localStorage.setItem("CL_" + _ulp, _ulcid); }
</script>

変更後着地点タグ

<script>
var _CIDN = "cid";
var _PMTN = "p";
var _param = location.search.substring(1).split("&");
var _ulp = "", _ulcid = "";
for(var i = 0; _param[i]; i++){ var kv = _param[i].split("="); if(kv[0] == _PMTN && kv[1].length > 1){ _ulp = kv[1]; } if(kv[0] == _CIDN && kv[1].length > 1){ _ulcid = kv[1]; }}
if(_ulp && _ulcid){ document.cookie = "CL_" + _ulp + "=" + decodeURIComponent(_ulcid) + "; expires=" + new Date(new Date().getTime() + (63072000000)).toUTCString() + "; domain=thebase.in; path=/;"; localStorage.setItem("CL_" + _ulp, _ulcid); }
</script>

※「domain=thebase.in;」を追記

次に「JSタグ(成果地点)」を以下のように編集します。

変更前成果地点タグ

<script>
var _CIDN = "cid";
var _PMTV = "pfwsron0zkwe";
var _TRKU = "https://demo.leafworks.jp/package/affilicode/business/track.php?p=" + _PMTV + "&t=5bdaddd7";
var _cks = document.cookie.split("; ");
var _cidv = "";
for(var i = 0; i < _cks.length; i++){ var _ckd = _cks[i].split( "=" ); if(_ckd[0] == "CL_" + _PMTV && _ckd[1].length > 1){ _cidv = _ckd[1]; break; }}
if(!_cidv && localStorage.getItem("CL_" + _PMTV)){ _cidv = localStorage.getItem("CL_" + _PMTV); };
if(_cidv){ _TRKU += "&" + _CIDN + "=" + _cidv };
img = document.body.appendChild(document.createElement("img"));
img.src = _TRKU;
</script>

変更後成果地点タグ

<script>
document.addEventListener("DOMContentLoaded", function() {
var _CIDN = "cid";
var _PMTV = "pfwsron0zkwe";
var _TRKU = "https://demo.leafworks.jp/package/affilicode/business/track.php?p=" + _PMTV + "&t=5bdaddd7";
var _cks = document.cookie.split("; ");
var _cidv = "";
for(var i = 0; i < _cks.length; i++){ var _ckd = _cks[i].split( "=" ); if(_ckd[0] == "CL_" + _PMTV && _ckd[1].length > 1){ _cidv = _ckd[1]; break; }}
if(!_cidv && localStorage.getItem("CL_" + _PMTV)){ _cidv = localStorage.getItem("CL_" + _PMTV); };
if(_cidv){ _TRKU += "&" + _CIDN + "=" + _cidv };
img = document.body.appendChild(document.createElement("img"));
img.src = _TRKU;
});
</script>

※2行目の「document.addEvent~」と13行目の「});」を追記

アフィリコード・システム側の準備が完了したら、次にBASE側の設定に移ります。

BASE側の設定

BASE側での初期サイト開設時は「apps」がインストールされていない状態です。以下の「apps」ボタンをクリックし、BASEで使用できる「apps」一覧画面に移ります。

appsボタン

appsの一覧画面から、以下のappsをインストールします。(※無料でインストールできます。)

  • HTML編集
  • 広告効果測定
appsのインストール

インストールが完了したら、アフィリコード・システム側で用意したタグを設定していきます。

まずは、「JSタグ(着地点)」の設定を行います。基本的にはアフィリエイターのメディア(BLOGなど)に張られている広告をクリックしてからの遷移先ページに着地点タグを設置します。

今回の例では、商品詳細ページに着地点タグを設置します。
(※その他商品一覧ページなどにも設置は可能です。)

まずはBASE管理画面の「デザイン」ボタンをクリックします。

デザインボタン

次に商品画像下に配置されている「詳細を見る」ボタンから商品の詳細ページを開きます。

デザイン編集画面

次に左メニューの「HTMLを編集する」ボタンからHTML編集画面を開きます。

HTML編集画面

この編集画面の下部の</body>タグ直前に着地点タグを設置します。

着地点タグの設置

「プレビューの更新」ボタンから設定を更新し、最後にデザイン編集を「保存」して「終了」します。着地点タグの設置は以上です。

次に成果地点タグを設置します。BASE管理画面の「Apps」ボタンから「広告効果測定」を無料でインストールします。

appsインストール

インストールをクリックすると、広告効果測定設定画面に遷移するので、「その他のタグを設定」エリアに、先ほど作成した成果地点タグを貼り付けます。

成果地点タグの貼りつけ

貼り付けたら、「全ての変更を保存する」から設定を保存して終了です。

トラッキングタグに注文IDと合計金額を付与する

アフィリコード・システムで受け取るトラッキングタグに注文IDと合計金額をパラメータ付与したい場合は、アフィリコード・システムから、以下にチェックを入れ、「取得タグ変換」を行ってからタグを取得します。

アフィリコード・システムのパラメータ設定

パラメータ「args」と「price」が付与された成果地点タグ

<script>
var _CIDN = "cid";
var _PMTV = "pfwsron0zkwe";
var _ARGSV = "";
var _PRICEV = "";
var _TRKU = "https://demo.leafworks.jp/package/affilicode/business/track.php?p=" + _PMTV + "&args=" + _ARGSV + "&price=" + _PRICEV + "&t=5bdaddd7";
var _cks = document.cookie.split("; ");
var _cidv = "";
for(var i = 0; i < _cks.length; i++){ var _ckd = _cks[i].split( "=" ); if(_ckd[0] == "CL_" + _PMTV && _ckd[1].length > 1){ _cidv = _ckd[1]; break; }}
if(!_cidv && localStorage.getItem("CL_" + _PMTV)){ _cidv = localStorage.getItem("CL_" + _PMTV); };
if(_cidv){ _TRKU += "&" + _CIDN + "=" + _cidv };
img = document.body.appendChild(document.createElement("img"));
img.src = _TRKU;
</script>

BASEで用意されている変数を設定した成果地点タグ

<script>
var _CIDN = "cid";
var _PMTV = "pfwsron0zkwe";
var _ARGSV = "{%order_id%}";
var _PRICEV = " {%item_total%}";
var _TRKU = "https://demo.leafworks.jp/package/affilicode/business/track.php?p=" + _PMTV + "&args=" + _ARGSV + "&price=" + _PRICEV + "&t=5bdaddd7";
var _cks = document.cookie.split("; ");
var _cidv = "";
for(var i = 0; i < _cks.length; i++){ var _ckd = _cks[i].split( "=" ); if(_ckd[0] == "CL_" + _PMTV && _ckd[1].length > 1){ _cidv = _ckd[1]; break; }}
if(!_cidv && localStorage.getItem("CL_" + _PMTV)){ _cidv = localStorage.getItem("CL_" + _PMTV); };
if(_cidv){ _TRKU += "&" + _CIDN + "=" + _cidv };
img = document.body.appendChild(document.createElement("img"));
img.src = _TRKU;
</script>

以下を追加
var _ARGSV = "{%order_id%}";
var _PRICEV = " {%item_total%}";

以上の設定で終了です。
先の設定と同様に「その他のタグを設定」エリアに貼り付けて設定完了です。

最後にテスト注文を行い、無事成果が上がればすべての設定が完了です。
パラメータを付与している場合は、正常にパラメータが付与されているかも確認してください。

製品情報

アフィリエイト広告配信システム「アフィリコード・システム」
製品アフィリコード・システム
概要アフィリエイト広告配信システム
「アフィリコード・システム」

自社アフィリエイト運用から本格的なASP運営まで
導入実績700社以上!多機能アフィリエイトシステム
URLhttps://system.affilicode.jp/

関連記事