ECCUBE3構築サイトにA8タグをセットすることが出来ました。
A8アフェリエイトでは、「ランディングページに設置したタグ」と「成果発生ページに設置したタグ」を使って、「誰が何をどれだけ売ってくれたのか?」をトラッキングします。
簡単に設置できるのかと思いきや、ECCUBE3サイトへの設置はかなりハードルが高いです。かなり苦労して設置したのでまとめておきたいと思います。
「ランディングページ用のタグ」の設置(簡単)
1. ECCUBE管理画面から新規ブロック「A8ランディングページタグ」を作成
2. A8から支給された「ランディングページタグ」を貼り付け
中身はこれ。<script src=”//statics.a8.net/a8sales/a8sales.js”></script>
3. ランディングページのheadに設置(自分の場合は全ページに設置しました)
以上です。ランディングページタグの設置はとても簡単です。
続けて「成果発生タグ」の設置に進みましょう。
「成果発生ページタグ」の設置その1
↑A8設置マニュアルより
えっ???何???意味不明???
どのファイルをどうすればよいのか全くわかりません…
pidはA8から支給されますので、問題ありません。(テスト段階ではテスト用のIDを使用します)
最終的にECCUBEから持ってくる必要があるのは以下の要素です。
- order_number 注文番号
- price 単価
- quantity 個数
※他の要素は省略時の自動計算とかあるので不要です。
疑問:どうやってこれらの情報を持ってくるのか???
「eccube3 a8タグの設置」でググってもよくわからず、A8サイドでも確実な情報を持っていません。
結論:頑張っていろいろやってみるしか無い!
1.注文完了画面でコンバージョンタグを表示する方法
まずはこのサイトを参考にしました。
該当ファイルがどこに有るのかよくわかりません。
で、FTPソフトから検索してみたらそれらしきファイルが見つかりました。
このファイルを開くと、350行目あたり(バージョンにより異なる?)に以下の記述があります。
log_info(‘購入処理完了’, array($orderId));
return $app->render(‘Shopping/complete.twig’, array(
‘orderId’ => $orderId,
));
}
これを以下のように変更します。(赤字部分を追記)
log_info(‘購入処理完了’, array($orderId));
$Order = null;
if (!empty($orderId)) {
$Order = $app[‘eccube.repository.order’]->find($orderId);
}return $app->render(‘Shopping/complete.twig’, array(
‘orderId’ => $orderId,
‘Order’ => $Order, // Order変数を追加
));
}
これで、注文番号や単価などの購入情報を「購入完了ページ」に持ってくることができるようになりました。
次はこちら↓
購入完了ページが表示されたら、A8サーバーに購入情報を渡すようにします。
complete.twigは、ECCUBEの管理画面から変更できます。
右端の…から「ページ編集」。しかし、うまく行きませんでした。
購入完了画面(Shopping/complete.twig)に追記すると、完了ページが表示されなくなります。注文自体は成立するのですが、完了ページの代わりにエラーページが出るので、ここをもとに戻しました。
なので、ここは一旦放置。
complete.twigには手を付けないように。
この状態で、A8サイドのエンジニアを交えてメールでいろいろやり取りをしましたが、なかなかうまく行きません。
- 記述位置をいろいろ変更 → 改善せず
- <!– {{dump(Order)}} –>を入れてみる → 改善せず
- ECCUBE3のformメソッド変更、設置位置変更など → 改善せず
ところがあるタイミングで「DNS方式」を提案されました。
エックスサーバーでDNSを設定
直下、または並列のサブドメインを作成し、cnameを設定とのことなので、早速トライ。エックスサーバーはサブドメインの設定が簡単に行なえます。ちなみに今回のECCUBEサイト自体がサブドメインだったので、並列でのサブドメインを作成しました。
エックスサーバーの管理画面からサブドメイン設定
サブドメイン設定の追加に進む
こんな感じになりました。
ドメインそのままです(笑)。下の段がそもそものECCUBEサイト、上が新しく設定したサブドメインです。
で、このサブドメインのDNSレコードを設定
該当ドメインを選択して
CNAMEに「trck.a8.net」を入れる
設定完了しました。
再び、購入完了画面のタグ設置に戻ります。
「成果発生ページタグ」の設置その2
ECCUBE管理画面から新規ブロックを作成します。
以下のように設定
<script>
a8sales({
“pid”: “s00000012345678”,
“order_number”: “{{ orderId }}”,
“currency”: “JPY”,
“items”: [
{
{% for OrderDetail in Order.OrderDetails %}
“code”: “{{ OrderDetail.product_code }}”,
“price”:{{ OrderDetail.price }},
“quantity”: {{ OrderDetail.quantity }}
{% endfor %} },
],
});
</script>
※pidはA8から支給されます。テスト時にはテスト用のIDを記入します。
一覧に出ました。
そしてこのブロックを購入完了ページに設置。
以上で設置完了です。このあと、A8側が実施するタグテストにも無事合格しました。
せっかくなので、「面倒だから全部やって」という方からの外注もお受けしたいと思います(設置のみ3万円、A8対応込5万円)。サブドメインが設置できてDNS設定可能なサーバーであればたぶんOKです。まずはメールにてご相談ください。