WooCommerce + WordPress 追跡コード設定方法

WooCommerce のカートシステムをご利用の広告主様向けに、追跡コードの設定方法をご案内いたします。

WooCommerce について

WooCommerce(ウーコマース)は、現在、世界で最も利用されているCMSのWordPressに簡単にインストールできるネットショップ構築プラグインです。

Woocommerce公式サイト

WooCommerce + WordPress 追跡コード設定方法

WooCommerce のテーマ全ヘッダーにITP対応コードを追加

WooCommerce がインストールされているWordPressのダッシュボードにアクセスし、画面左メニューの「外観」→「テーマエディター」をクリックしてください。

Welcart + WordPress 追跡コード設定方法

右上の「編集するテーマを選択」でWooCommerceのテーマが選択されている事を確認して次にステップに進んでください。

WooCommerce + WordPress 追跡コード設定方法

右のファイル一覧より、「テーマヘッダー(header.php)」をクリックしてください。

WooCommerce + WordPress 追跡コード設定方法

マネートラックのダッシュボードにアクセスし、管理画面右上メニューの「設定管理」→「追跡コード」にアクセスしてください。

Monetrack追跡コードの設置

追跡コードページを表示し、「物販向け追跡コード」→「ITP対応追跡コード」にをクリックしてください。

Monetrack 追跡コード設定方法

ITP対応物販トラッキングコードが表示されている事を確認し、「コードをコピー」をクリックしてコピーしてください。もしくは、以下のコードをコピーしてください。

《ITP対応コード》

<script type='text/javascript'>
(function(d) {
var scriptTrack = document.createElement('script');
scriptTrack.src = 'https://assets.monetrack.com/scripts/track.js';
scriptTrack.async = true;
document.getElementsByTagName('head')[0].appendChild(scriptTrack);
})(document);
</script>

Monetrack追跡コードの設置

ワードプレスのテーマファイル編集ページにもどり、「テーマヘッダー(header.php)」ファイルにマネトラックの管理画面よりコピーした追跡コードを<head></head>内に貼りつけてください

WooCommerce + WordPress 追跡コード設定方法

ヘッダー内にマネトラックのITP対応追跡コードが正しく設置されている事を確認の上、「ファイルを更新」をクリックしてください。

WooCommerce + WordPress 追跡コード設定方法

貴社のショップページ全ヘッダーに物販トラッキングコード(ITP対応)が挿入されました。次に注文完了ページの追跡コードの設置ステップに移ってください。

WooCommerceの注文完了ページに追跡コード設置

WooCommerceでの購入完了ページの編集はWooCommerce コンバージョントラッキング
をインストールします。

WordPressのダッシュボード左メニューの「プラグイン」→「新規追加」をクリックしてください。プラグインの新規追加ページの上、WooCommerce コンバージョントラッキングを検索の上、インストールしてください。

WooCommerce + WordPress 追跡コード設定方法

プラグインのインストールが完了した事を確認し、「プラグインを有効化」をクリックしてください。デフォルトの設定が無効化なので、新規でプラグインを追加した場合有効化する必要があります。

WooCommerce + WordPress 追跡コード設定方法

プラグインが正常に完了し、有効化になっている事を確認の上、左のメニュー画面より「WooCommerce」→「Conversion Tracking」をクリックしてください。

WooCommerce + WordPress 追跡コード設定方法

「Custom」のトグルボタンをアクティブにしてください。

WooCommerce + WordPress 追跡コード設定方法

マネトラックのダッシュボードに戻り、物販向け追跡コードページ最下部にある「パラメーター設定」に移動してください。

Monetrack追跡コード設定方法

こちらのステップではWooCommerce の変数へとカスタマイズを行います。以下の変数を「貴サイトでお使いの変数」の列に入力してください。

《WooCommerceで使用可能な変数》
注文番号 {order_number}
合計金額 {order_total}

WooCommerce + WordPress 追跡コード設定方法

「購入完了ページに設置の追跡コード」→「A: コンバージョンページの追跡コード(推奨)」に前のステップで入力した変数が入力されているかを確認の上、「コードをコピー」をクリックしてコピーしてください。もしくは以下のコードをコピーしてください。

《コンバージョンページの追跡コード》
<script>
var orderID = "{order_number}";
var totalCost = "{order_total}";
var productInfo = [];
productInfo.push({
product_id: "",
product_price: "",
product_quantity: "",
product_name: ""
});
</script>

WooCommerce + WordPress 追跡コード設定方法

WordPress管理画面の「Conversion Tracking」ページに戻り、マネトラック管理画面よりコピーした追跡タグを貼り付け、「Save Changes」をクリックし保存してください。

WooCommerce + WordPress 追跡コード設定方法

購入完了ページ追跡タグが設置されました。

設定完了

設定完了後は、弊社にて成果疎通テストを行いますので、マネートラックサポートまでご連絡ください。弊社の管理画面よりメッセージが送信できます。

なお、上記コードは、2020年9月1日現在、マネートラックが確認したWooCommerceの変数をもとに、独自にカスタマイズを行なったものです。設定がうまくいかない場合は、最新の変数をご確認ください。

Welcart + WordPress 追跡コード設定方法