人気ワード

Copy Title & URL

Bookmark

Feed

Share

Shopify(ショッピファイ)とアフィリコード・システムの連携方法

Shopify(ショッピファイ)とアフィリコード・システムの連携方法

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

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

【Shopify】でオンラインストアを作る はこちら

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

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

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

  • PHPファイルのアップロードができないため、JSタグのみ対応可能
  • ITP制限がかかっている場合、広告クリックから「1週間」以内での購入が必要

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

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

アフィリコード・システム管理画面より、当該広告詳細画面から以下2種類のトラッキングタグを取得し、メモ帳などに控えておきます。

  • 着地点タグ
  • 成果地点タグ

着地点タグ
着地点タグに関しては、そのまま使用します。

トラッキングタグの取得
※画面はアフィリコード・システム Ver.3.6.0 以降のトラッキングタグ取得画面です。

成果地点タグ
成果地点タグに関しては、以下のパラメータを含めたトラッキングタグに変換して使用します。

  • 成果識別子(args)
  • 購入金額(price)
成果地点タグの生成
※画面はアフィリコード・システム Ver.3.6.0 以降のトラッキングタグ取得画面です。

「変換」をクリックし、成果識別子と購入金額が追加されたトラッキングタグを控えておきます。

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

Shopify側の設定

着地点タグの設置方法

まずは着地点タグを設置します。Shopifyストアにログイン後、メニューからテーマ > カスタマイズ と移ります。

カスタマイズの方法

次に、テンプレートのカスタマイズ画面のメニュー最下部より、テーマアクション > コードを編集する でコード編集画面に移ります。

コード編集画面

コードの編集画面に遷移したら、「Layout」から「{ / } theme.liquid」をクリックし、theme.liquidファイルを開きます。
ソースコードの「</head>」タグ上部に着地点タグを貼り付けてください。

着地点タグの設置

貼り付けたら必ず保存を忘れずに行ってください。

成果地点タグの設置方法

次に成果地点タグを設置します。成果地点は「チェックアウト」に設定します。
※先のコード編集画面にいる場合は画面を閉じ、テンプレートのカスタマイズ画面左上アイコン「閉じる」で画面を閉じてください。

ホームに戻ったら、メニュー「設定」から「チェックアウト」をクリックします。

チェックアウト方法

チェックアウト設定画面の「注文処理」設定項目の追加スクリプトに成果地点タグを貼り付けます。

成果地点タグの設置

次に「成果識別子」と「購入金額」をShopify専用の「変数」に書き換えます。対応する変数は以下の通りです。

  • 成果識別子 ⇒ {{ order_number }}
  • 購入金額 ⇒ {{ total_price | money_without_currency }}
パラメータの書き換え

<script>
(function(){
var _CIDN = "cid";
var _PLIDN = "plid";
var _ACTN = "cid_auth_get_type";
var _APTN = "plid_auth_get_type";
var _PMTV = "pfwsron0zkwe";
var _ARGSV = "{{ order_number }}";
var _PRICEV = "{{ total_price | money_without_currency }}";
var _TRKU = "https://demo.leafworks.jp/package/affilicode/system/track.php?p=" + _PMTV + "&args=" + _ARGSV + "&price=" + _PRICEV;
var _cks = document.cookie.split("; ");
var _cidv = "", _plidv = "", _actv = "", _aptv = "";
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]; } if(_ckd[0] == "PL_" + _PMTV && _ckd[1].length > 1){ _plidv = _ckd[1]; } if(_ckd[0] == "ACT_" + _PMTV && _ckd[1].length > 1){ _actv = _ckd[1]; } if(_ckd[0] == "APT_" + _PMTV && _ckd[1].length > 1){ _aptv = _ckd[1]; } if(_cidv && _plidv && _actv && _aptv) break; }
if(!_cidv && localStorage.getItem("CL_" + _PMTV)){ _cidv = localStorage.getItem("CL_" + _PMTV); _actv = "ls"; }
if(_cidv){ _TRKU += "&" + _CIDN + "=" + _cidv; }
if(!_plidv && localStorage.getItem("PL_" + _PMTV)){ _plidv = localStorage.getItem("PL_" + _PMTV); _aptv = "ls"; }
if(_plidv){ _TRKU += "&" + _PLIDN + "=" + _plidv; }
if(_actv){ _TRKU += "&" + _ACTN + "=" + _actv; }
if(_aptv){ _TRKU += "&" + _APTN + "=" + _aptv; }
img = document.body.appendChild(document.createElement("img"));
img.src = _TRKU + "&t=5bdaddd7";
}());
</script>

※変換する変数に関してはShopifyのサポートページも合わせてご確認ください。

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

製品情報

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

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

関連記事