Referral Tracking

トラッキングスクリプト

Blitz Rocketのトラッキングスクリプトをウェブサイトにインストールする

トラッキングスクリプト

Blitz Rocketのトラッキングスクリプトは、紹介訪問、サインアップ、購入を自動的に追跡するためにウェブサイトに追加する軽量のJavaScriptスニペットです。

インストール

以下のスクリプトをウェブサイトに追加してください。YOUR_CAMPAIGN_IDはBlitz Rocketダッシュボードの実際のキャンペーン/コンテストIDに置き換えてください：

html
<script
  src="https://blitzrocket.com/referral-tracker.js?campaignId=YOUR_CAMPAIGN_ID&autoInject=stripe"
  async
></script>

autoInject=stripeパラメータはStripeのチェックアウト購入を自動的にキャプチャします。Stripeを使用していない場合や購入を手動で追跡したい場合は削除してください。

サインアップの追跡

ユーザーがサイトで登録を完了したときにRocketTracker.trackSignup()を呼び出します：

javascript
// ユーザーが正常に登録した後
if (window.RocketTracker) {
  window.RocketTracker.trackSignup("newuser@example.com");
}

購入の追跡

ユーザーが購入を完了したときにRocketTracker.trackPurchase()を呼び出します：

javascript
// 購入が確定した後
if (window.RocketTracker) {
  window.RocketTracker.trackPurchase(
    "order-12345",  // orderId
    49.99,          // 金額
    "USD",          // 通貨
    "buyer@example.com" // メールアドレス（任意）
  );
}

紹介コードの取得

紹介リンク訪問から保存された現在の紹介コードを取得します：

javascript
if (window.RocketTracker) {
  const code = window.RocketTracker.getReferralCode();
  if (code) {
    console.log("現在の紹介コード:", code);
  }
}

紹介＆アフィリエイトコードの検出

トラッキングスクリプトはURLパラメータからコードを自動検出し、使用されているパラメータによって紹介プログラムとアフィリエイトプログラムを区別します：

  • 紹介プログラム: ?code=ABC123 または ?ref=ABC123
  • アフィリエイトプログラム: ?aff=XYZ789 または ?fpr=XYZ789（FirstPromoterスタイル）

各プログラムは独自のクッキー名前空間に保存されるため、単一のサイトで紹介プログラムとアフィリエイトプログラムを同時に運用できます：

  • 紹介コード → blitzrocket_referral_code クッキー
  • アフィリエイトコード → blitzrocket_affiliate_code クッキー

コードはキャンペーン内でのみ一意であるため、スクリプトは訪問者が最初にアクセスした際にサーバー経由でコードがどのキャンペーンに属するかを解決します。検出されたコードはその後の追跡呼び出しに含まれます。

ドメインは同時に最大1つの紹介プログラムと1つのアフィリエイトプログラムのみをアクティブにできます。プログラムを切り替える場合は、既存のものを先に無効化してください。

特定のプログラムを指定する

サーバーサイドで追跡する場合は該当するクッキーを読み取ります。両方のプログラムを運用しているサイトでJSヘルパーを使う場合は、プログラムタイプを明示的に渡してください：

javascript
// アフィリエイトのサインアップを特定して追跡
window.RocketTracker.trackSignup("newuser@example.com", { type: "affiliate" });

// アフィリエイトの購入を特定して追跡
window.RocketTracker.trackPurchase("order-12345", 49.99, "USD", "buyer@example.com", { type: "affiliate" });

フレームワーク統合

Nuxt 3

Blitz Rocketは組み込みのNuxtプラグインを提供しています。NUXT_PUBLIC_BLITZROCKET_CAMPAIGN_ID環境変数を設定するとスクリプトが自動的に読み込まれます。

また、提供されている$blitzrocketヘルパーも使用できます：

vue
<script setup>
const { $blitzrocket } = useNuxtApp();

async function handleSignup(email) {
  await $blitzrocket.trackSignup(email);
}

async function handlePurchase(order) {
  await $blitzrocket.trackPurchase(
    order.id,
    order.total,
    order.currency,
    order.email
  );
}

const referralCode = $blitzrocket.getReferralCode();
</script>

Next.js

jsx
// app/layout.js
import Script from "next/script";

export default function RootLayout({ children }) {
  const campaignId = process.env.NEXT_PUBLIC_BLITZROCKET_CAMPAIGN_ID;

  return (
    <html>
      <head>
        <Script
          id="blitzrocket-tracker"
          src={`https://blitzrocket.com/referral-tracker.js?campaignId=${campaignId}&autoInject=stripe`}
          strategy="afterInteractive"
        />
      </head>
      <body>{children}</body>
    </html>
  );
}

プレーンHTML

html
<!DOCTYPE html>
<html>
  <head>
    <script
      src="https://blitzrocket.com/referral-tracker.js?campaignId=YOUR_CAMPAIGN_ID&autoInject=stripe"
      async
    ></script>
  </head>
  <body>
    <!-- ページコンテンツ -->
  </body>
</html>

Googleタグマネージャー

  1. GTM → タグ → 新しいタグ に移動
  2. カスタムHTML を選択
  3. 以下を貼り付け：
html
<script
  src="https://blitzrocket.com/referral-tracker.js?campaignId=YOUR_CAMPAIGN_ID&autoInject=stripe"
  async
></script>
  1. トリガーをすべてのページに設定
  2. 変更を公開