• デベロッパーガイド
  • SDKの実装
  • Web SDK

Web SDK

Airbridge Web SDKは, Web to App（Webからアプリへの誘導）のコンバージョンデータだけでなく、Web アプリ自体のデータも追跡します。特に、Webとモバイルの両方でアプリを実行している場合、ユーザージャーニーに関するより広範囲なをインサイトを得ることができます。Web SDKから収集したデータは、Airbridgeダッシュボードにて集計、表示され、Webとアプリ両方に関する総合的な解析を提供します。また、簡単にローデータをCSV形式でエクスポートすることもできます。

SDKの実装ガイド

SDKのインストール

SDKをインストールするには、以下の3つのオプションのうちいずれかを使用します。

関数として直接インストール（オプション1）

Headタグの最後に以下のコードを追加します。

12345678
<script>
(function(a_,i_,r_,_b,_r,_i,_d,_g,_e){function q(b,a){function d(){var l=x(b,a);y(l)}if(0<_g){var e,f=new (null!=(e=a_.XDomainRequest)?e:a_.XMLHttpRequest);e=function(){};f.open("GET",a);f.timeout=_g;f.onload=d;f.onerror=e;f.onprogress=e;f.ontimeout=e;f.send()}else d()}function y(b){if("complete"===i_.readyState)i_.head.appendChild(b);else{var a=function(){a_.removeEventListener("load",a);i_.head.appendChild(b)};a_.addEventListener("load",a)}}function x(b,a){var d=i_.createElement(r_);d.async=!0;d.src=a;d.onerror=function(){return z(b)};return d}function z(b){b.queue.filter(function(a){return 0<=_d.indexOf(a[0])}).forEach(function(a){a=a[1];a=a[a.length-1];"function"===typeof a&&a("Failed to load Airbridge SDK.")})}function r(b){var a={queue:null!=b?b:[],get isSDKEnabled(){return!1}};_i.concat(_d).forEach(function(d){var e=d.split("."),f=e.pop();e.reduce(function(l,t){var u;return l[t]=null!=(u=l[t])?u:{}},a)[f]=function(){a.queue.push([d,arguments])}});return a}null!=a_.__AIRBRIDGE__||(a_.__AIRBRIDGE__={mocks:[]});"undefined"!==typeof i_.documentMode&&(_r=_r.replace(/^https:/,""));a_.createAirbridge=function(){var b=r(),a;null==(a=a_.__AIRBRIDGE__)||a.mocks.push(b);q(b,_r);return b};a_[_b]||(_e=r(_e),a_[_b]=_e,q(_e,_r))})(window,document,"script","airbridge","https://static.airbridge.io/sdk/latest/airbridge.min.js","init startTracking stopTracking openBanner setBanner setDownload setDownloads openDeeplink setDeeplinks sendWeb setUserAgent setMobileAppData setUserID clearUserID setUserEmail clearUserEmail setUserPhone clearUserPhone setUserAttribute removeUserAttribute clearUserAttributes setUserAlias removeUserAlias clearUserAlias clearUser setUserId setUserAttributes addUserAlias setDeviceAlias removeDeviceAlias clearDeviceAlias setDeviceIFV setDeviceIFA setDeviceGAID events.send events.signIn events.signUp events.signOut events.purchased events.addedToCart events.productDetailsViewEvent events.homeViewEvent events.productListViewEvent events.searchResultViewEvent".split(" "),["events.wait","fetchResource","createTouchpoint","createTrackingLink"],0);

airbridge.init({
    app: '<YOUR_APP_NAME>',
    webToken: '<YOUR_WEB_TOKEN>',
})
</script>

Airbridgeダッシュボード → Settings → Tokensを選択して、アプリ名とWeb SDKトークンを確認できます。

Protected Attribution Window setup

Web to Appの貢献度を測定する際、保護されたアトリビューションウィンドウの設定を推奨します。詳細については、このガイド を参照してください。

NPMモジュールを使用したインストール（オプション2）

  1. Airbridge NPMモジュールをインストールします。

Shell
1
npm install airbridge-web-sdk-loader

  1. airbridgeをインポートして、airbridge.init関数を呼び出します。

123456
import airbridge from 'airbridge-web-sdk-loader'

airbridge.init({
    app: '<YOUR_APP_NAME>',
    webToken: '<YOUR_WEB_TOKEN>',
})

Google Tag Managerを使用したインストール（オプション3）

「Google Tag Managerを使用したSDKのインストール」を参照してください。

対応ブラウザ

Airbridge Web SDKは、ES5対応のすべてのブラウザで動作します。

SDKのテスト

1
console.log(airbridge.isSDKEnabled)

SDKがインストールされたWebページに移動して、デベロッパーツールのコンソールでairbridge.isSDKEnabledが「true」であることを確認します。

出力が適切であれば、「Airbridgeダッシュボード → Raw Data → Web Real-time Log」を選択して、「オープン」イベントが表示されていることを確認します。

注意

airbridge.isSDKEnabled の初期値は false です。Web SDK の読み込みと初期化が正常に完了すると、true に変わります。

ネットワーク環境によって読み込みが遅延する場合があり、読み込みが完了する前に確認すると false が出力される場合があります。

ユーザー設定

SDK初期化時のユーザー識別子と属性の設定

ユーザー情報は、SDKの初期化時に自動的に送信されます。ユーザー情報はブラウザのローカルストレージに保存され、それ以降、Webサイトでのすべてのイベントは、signOutが呼び出されるまでユーザー情報とともに送信されます。

1234567891011121314151617
airbridge.init({
    app: '<YOUR_APP_NAME>',
    webToken: '<YOUR_WEB_TOKEN>',
    // ...
    user: {
        externalUserID: 'personID',
        externalUserEmail: 'persondoe@airbridge.io',
        externalUserPhone: '1(123)123-1234',
        attributes: {
            age_group: 30,
            gender: 'Female'
        },
        alias: {
            custom_id: '83587901-2726-4E29-ACEB-A90B0F7E75F6',
        },
    },
})

ユーザー識別子の設定

外部識別子ではなく、独自のユーザー識別子を設定するには、以下のメソッドを使用します。ユーザー識別子はブラウザのローカルストレージに保存され、それ以降、Webサイトでのすべてのイベントは、signOutが呼び出されるまでユーザー情報とともに送信されます。

12
airbridge.setUserID('654321')
airbridge.setUserEmail('user@example.com')

また、サードパーティツール（Amplitude, Brazeなど）とのマッチングに使用されるユーザーのエイリアスを設定することもできます。

12
airbridge.setUserAlias('amplitude_id', '12345678')
airbridge.setUserAlias('braze_ext_id', '87654321')

ユーザー属性の設定

より正確なマルチタッチアトリビューション（MTA）解析、追加の内部データ解析、そして、サードパーティソリューションのリンクのために追加のユーザー属性が使用されます。

123
airbridge.setUserAttribute('age', 45)
airbridge.setUserAttribute('gender', 'male')
airbridge.setUserAttribute('name', 'John Doe')

テスト

ユーザー情報の設定値が、SDKから適切に送信されていることを確認します。

  1. ユーザー識別子の情報を設定します。

  2. SDKを使用して、イベントを送信します。

  3. 「Airbridgeダッシュボード → Raw Data → Web Real-time Logs」を選択して、イベントをクリックします。

  4. ユーザー情報が、userブロックの下に正しく送信されているかを確認します。

デバイス設定

デバイスの識別子の設定

Airbridge SDKからデバイスの識別子を設定します。デバイス識別子は、削除しない限り、Webサイトを閉じた後でも保持されます。

123
airbridge.setDeviceAlias('YOUR_KEY', 'YOUR_VALUE')
airbridge.removeDeviceAlias('YOUR_KEY')
airbridge.clearDeviceAlias()

注意

iOSの場合、クッキーの最大保存時間に基づいて最大7日間デバイスの識別子を保持します。

イベント設定

重要なユーザーアクションが発生したときに、アプリ内イベントを送信して、各チャネルのパフォーマンスを測定することができます。

すべてのイベントパラメータはオプションです。ただし、イベントに関する情報が増えると、より正確な統計を得ることができます。

カスタムイベント

名称: send

1234567891011
airbridge.events.send('category', {
    label: 'label',
    action: 'action',
    value: 10,
    semanticAttributes: {
        transactionID: 'transaction_123',
    },
    customAttributes: {
        key: 'value',
    }
})

標準イベント

ホーム画面の表示

1
airbridge.events.send('airbridge.ecommerce.home.viewed')

ユーザーのサインアップ

1234
airbridge.setUserID('ab180')
airbridge.setUserEmail('user@example.com')

airbridge.events.send('airbridge.user.signup')

ユーザーログイン

1234
airbridge.setUserID('ab180')
airbridge.setUserEmail('user@example.com')

airbridge.events.send('airbridge.user.signin')

ユーザーログアウト

123
airbridge.events.send('airbridge.user.signout')

airbridge.clearUser()

製品リストの表示

123456789101112131415161718192021
airbridge.events.send('airbridge.ecommerce.productList.viewed', {
    semanticAttributes: {
        productListID: 'food',
        products: [
            {
                productID: 'coke_zero',
                name: 'Coke Zero',
                price: 1.99,
                currency: 'USD',
                position: 1
            },
            {
                productID: 'burger_cheese_double',
                name: 'Double Cheeseburger',
                price: 3.99,
                currency: 'USD',
                position: 2
            }
        ]
    }
})

製品詳細の表示

名称: products

型：配列<オブジェクト>

1234567891011
airbridge.events.send('airbridge.ecommerce.product.viewed', {
    semanticAttributes: {
        products: [{
            productID: 'coke_zero',
            name: 'Coke Zero',
            price: 1.99,
            currency: 'USD',
            position: 1
        }]
    }
})

検索結果の表示

123456789101112131415161718192021
airbridge.events.send('airbridge.ecommerce.searchResults.viewed', {
    semanticAttributes: {
        products: [
            {
                productID: 'coke_zero',
                name: 'Coke Zero',
                price: 1.99,
                currency: 'USD',
                position: 1
            },
            {
                productID: 'burger_cheese_double',
                name: 'Double Cheeseburger',
                price: 3.99,
                currency: 'USD',
                position: 2
            }
        ],
        query: 'Search Query'
    }
})

カートに追加

12345678910111213141516171819202122232425
airbridge.events.send('airbridge.ecommerce.product.addedToCart', {
    value: 13.95,
    semanticAttributes: {
        products: [
            {
                productID: 'coke_zero',
                name: 'Coke Zero',
                price: 1.99,
                currency: 'USD',
                quantity: 3,
                position: 1
            },
            {
                productID: 'burger_cheese_double',
                name: 'Double Cheeseburger',
                price: 3.99,
                currency: 'USD',
                quantity: 2,
                position: 2
            }
        ],
        cartID: '73926365',
        currency: 'USD'
    }
})

注文完了

1234567891011121314151617181920212223242526
airbridge.events.send('airbridge.ecommerce.order.completed', {
    value: 13.95,
    semanticAttributes: {
        products: [
            {
                productID: 'coke_zero',
                name: 'Coke Zero',
                price: 1.99,
                currency: 'USD',
                quantity: 3,
                position: 1
            },
            {
                productID: 'burger_cheese_double',
                name: 'Double Cheeseburger',
                price: 3.99,
                currency: 'USD',
                quantity: 2,
                position: 2
            }
        ],
        inAppPurchased: true,
        currency: 'USD',
        transactionID: '16874326'
    }
})

イベント送信の検証

イベントがSDKから適切に送信されていることを確認します。

  1. SDKを使用して、イベントを送信します。

  2. 「Airbridgeダッシュボード → Raw Data → Web Real-time Logs」を選択して、イベントが表示されているかを確認します。

Web to Appの設定

Airbridge Web SDKでは、Web to Appのシームレスな体験をユーザーに提供することができます。以下のメソッドを使用することで、開発者は各ボタンを個別にコーディングする必要はありません。また、ボタンは主要なすべてのブラウザで動作します。

ダウンロードボタンの追加

ボタンのID値を使用して、ダウンロード機能を追加し、そのパフォーマンスを追跡します。

12345678910111213141516171819
// html
<button id="app_download">Go to app</button>

// javascript
airbridge.setDownloads({
    buttonID: "app_download",
    // or ["app_download_1", "app_download_2", ...]
    defaultParams: {
        campaign: 'example_campaign',
        medium: 'example_medium',
        term: 'example_term',
        content: 'example_content'
    },
    ctaParams: {
        cta_param_1: '1',
        cta_param_2: '2',
        cta_param_3: '3',
    }
});

必須

  • buttonID：ボタンのID属性の値です。配列も可能です。

オプション

  • defaultParams：キャンペーンパラメータ

設定されている場合、ボタンをクリックするとdefaultParamsが送信されます。

注意

SDKはアプリマーケットにユーザーを送信する必要があるため、<a>タグやonclick機能は使用しないでください。

DeepLinkボタンの追加

ボタンのID値を使用してディープリンクを埋め込み、そのパフォーマンスを追跡します。

setDeeplinksでは、各ボタンのアクションをカスタマイズすることができます。各プラットフォーム（OS）のディープリンクへのリダイレクトを個別に設定できるだけでなく、フォールバックやキャンペーンパラメータをオーバーライドすることもできます。これにより、Web属性を正確に追跡することができます。また、Webサイトのすべてのボタンのディープリンクを個別に作成する必要がなくなります。

12345678910111213141516171819202122
airbridge.setDeeplinks({
    buttonID: "deeplinking-button-1",
    // or ["deeplink-button-1", "deeplink-button-2", ...]
    deeplinks: {
        ios: "ablog://main",
        android: "ablog://main",
        desktop: "https://www.airbridge.io/blog"
    },
    fallbacks: {
        ios: "itunes-appstore",
        // itunes-appstore(default), google-play, url
        android: "google-play"
        // google-play(default), itunes-appstore, url
    },
    defaultParams: {
        campaign: 'example_campaign',
        medium: 'example_medium',
        term: 'example_term',
        content: 'example_content'
    },
    desktopPopUp: true
});

必須

  • deeplinks.ios：iOS環境でボタンがクリックされたときに実行されるディープリンク。（スキームを使用するディープリンクのみ許可）

  • deeplinks.android：Android環境でボタンがクリックされたときに実行されるディープリンク。（スキームを使用するディープリンクのみ許可）

  • deeplinks.desktop：デスクトップ環境でボタンがクリックされたときに実行されるディープリンク。

  • fallbacks.ios：iOSでディープリンクが失敗した場合のデスティネーション

  • fallbacks.android：Androidでディープリンクが失敗した場合のデスティネーション

    • itunes-appstore：アプリのApple AppStoreページ

    • google-play ：アプリのAndroid PlayStoreページ

    • url ：http/httpsスキーマURL

  • buttonID：ボタンのid属性の値です。配列にすることができます。

オプション

  • defaultParams：キャンペーンパラメータ

  • desktopPopUp：trueに設定されている場合、デスクトップ環境の新しいウィンドウでディープリンクが実行されます。

  • 注意：SDKはアプリマーケットにユーザーを送信する必要があるため、<a>タグやonclick機能は使用しないでください。

リレーページの設定

redirect: trueが設定されている場合、ディープリンクはWebページにアクセスしようとする全ての着信リクエストに対して自動的に実行されます。

123456789101112131415
airbridge.setDeeplinks({
    buttonID: "deeplinking-button-1",
    deeplinks: {
        ios: "example://detail?id=1",
        android: "example://detail?id=1",
        desktop: "https://example.com/detail?id=1"
    },
    fallbacks: {
        // itunes-appstore(default), google-play, url
        ios: "itunes-appstore",
        // google-play(default), itunes-appstore, url
        android: "google-play"
    },
    redirect: true
});

関数呼び出しでアプリを開く

openDeeplink関数を呼び出すことで、アプリを開くことができます。

123456789101112
airbridge.openDeeplink({
    type: "redirect",
    deeplinks: {
        ios: "example://detail?id=1",
        android: "example://detail?id=1",
        desktop: "https://example.com/detail?id=1"
    },
    fallbacks: {
        ios: "itunes-appstore",
        android: "google-play"
    },
});

onclickなどユーザーのアクションで実行される関数を呼び出す場合はtype: "click"、ユーザーのアクションなしで直接アプリを開く場合はtype: "redirect"を使用してください。

Web to Appバナー

Web to App バナーは、Webユーザーがアプリをインストールする際に表示されるバナーです。

123456
airbridge.setBanner({
    title: 'AirStyle',
    description: 'Find your perfect style!!',
    keyColor: '#00a0c6',
    position: 1
})

タイトル、説明、ボタン、色、その他のバナーのプロパティを変更することができます。

詳細設定

キャンペーンパラメータの設定

広告のランディングページがWebサイトの場合、複数のパラメータを使用してURLに情報を追加することができます。パラメータを使用して、Webサイトへのユーザージャーニーを追跡することができます。

パラメータ解析は、自動または手動を選択できます。anual.

utmParsing （自動）

utmParsing: trueオプションでairbridge.initメソッドを呼び出すと、UTM値は自動的にAirbridgeキャンペーンパラメータとして保存され、AirbridgeのActualsレポートで確認できます。

utm_sourceが不明の場合、他のUTMパラメータは解析されません。

123456
airbridge.init({
    app: 'YOUR_APP_NAME',
    webToken: 'YOUR_WEB_TOKEN',
    // ...
    utmParsing: true,
})

URLは、window.location.href 値です。

urlQueryMapping （自動）

utmParsing: trueオプションでinitメソッドを呼び出すと、UTM値は自動的にAirbridgeキャンペーンパラメータとして保存され、AirbridgeのActualsレポートで確認できます。

urlQueryMappingを使用して、他のパラメータを自動的に保存することができます。airbridge.initメソッドが呼び出されると、urlQueryMappingのキーバリューペアが挿入されます。Airbridgeで使用できるキーを以下に示します。

utm_sourceやutm_campaignでinternal_codeなどのカスタムパラメータを使用すると、URLは以下のような構造になります。

  • https://example.com/?utm_source=google&utm_campaign=jan_ua_campaign&internal_code=ABC

以下は各パラメータをマッピングして、Airbridgeダッシュボードに表示する例です。

12345678910
airbridge.init({
    app: '<YOUR_APP_NAME>',
    webToken: '<YOUR_WEB_TOKEN>',
    // ...
    urlQueryMapping: {
        channel: 'utm_source',
        campaign: 'utm_campaign',
        sub_id_1: 'my_sub_id',
    },
})

上記URLからコンバージョンが発生した場合、「Airbridgeダッシュボード → Actuals Report → Configuration → GroupBy → Sub Sub Publisher 1」を選択して、internal_codeのデータを使用できます。

手動機能

以下は手動でパラメータを解析する例です。

paramsオブジェクトから情報を抽出し、init関数の呼び出し時に情報を登録します。

1234567891011121314151617181920212223242526272829303132

function queryStringToJSON(url) {
    if (url.search.slice !== undefined) {
        var pairs = url.search.slice(1).split('&');
    } else {
        var pairs = url.split('?')[1].split('&');
    }

    var result = {};
    pairs.forEach(function(pair) {
        pair = pair.split('=');
        result[pair[0]] = decodeURIComponent(pair[1] || '');
    });

    return JSON.parse(JSON.stringify(result));
}

var url = window.location.href;
var params = queryStringToJSON(url);

// initialize
airbridge.init({
    app: 'YOUR_APP_NAME',
    webToken: 'YOUR_WEB_TOKEN',
    defaultChannel: params['utm_source'],
    defaultParams: {
        campaign: params['utm_campaign'],
        medium: params['utm_medium'],
        content: params['utm_content'],
        term: params['utm_term']
    }
});

ユーザー情報の削除

ユーザーID、メールアドレス、電話番号、エイリアス、ユーザーの属性を削除するには、clearUserメソッドを使用します。

1
airbridge.clearUser()

ユーザー情報の暗号化

クライアントレベルでuser.externalUserEmailとuser.externalUserPhoneのハッシュ値 (SHA256) を生成します。user.externalUserIDはこのオプションによる影響を受けず、ハッシュ値は生成されません。

123456
airbridge.init({
    app: '<YOUR_APP_NAME>',
    webToken: '<YOUR_WEB_TOKEN?',
    // ...
    userHash: false, // Default true
})

イベント送信の遅延

イベントの送信が完了する前にリダイレクトが発生した場合（リレーページからイベントを送信など）、データが消失する可能性があります。リダイレクトされる前にイベントを確実に送信するには、events.waitを使用します。

1234567891011
airbridge.init({
    app: 'YOUR_APP_NAME',
    webToken: 'YOUR_WEB_TOKEN',
    // ...
})

airbridge.events.send('category')

airbridge.events.wait(3000, function (error) {
    location.href = 'url'
})

アトリビューションウィンドウの設定

アトリビューションウィンドウを調整するには、cookieWindowを使用します。

123456789101112131415
// Set attribution window to 1 day
airbridge.init({
    app: 'YOUR_APP_NAME',
    webToken: 'YOUR_WEB_TOKEN',
    // ...
    cookieWindow: 1,
})

// Set attribution window to 720 minutes (12 hours)
airbridge.init({
    app: 'YOUR_APP_NAME',
    webToken: 'YOUR_WEB_TOKEN',
    // ...
    cookieWindowInMinutes: 720,
})

cookieWindowとcookieWindowInMinutesの両方が設定されている場合、cookieWindowInMinutesが適用されます。

Cookie共有オプション

ユーザー追跡は、サブドメイン間で共有されるブラウザのCookieを介して行われます。サブドメイン間でCookieの共有を停止するには、shareCookieSubdomainをfalseに設定します。

1234567
// initialize 
airbridge.init({ 
    app: '<YOUR_APP_NAME>',
    webToken: '<YOUR_WEB_TOKEN>',
    // ...
    shareCookieSubdomain: false,
})

shareCookieSubdomainのデフォルト値はtrueです。

  • 1つのサービスが複数のサブドメインを使用している場合、trueを推奨します。

  • 複数のサービスが複数のサブドメインを使用している場合、falseを推奨します。

例

キャンペーンAトラッキングリンク → https://airbridge.io → https://blog.airbridge.io,

  • shareCookieSubdomain: true

    • https://airbridge.io上のイベント → キャンペーンAに起因

    • https://blog.airbridge.io上のイベント → キャンペーンAに起因

  • shareCookieSubdomain: false

    • https://airbridge.io上のイベント → キャンペーンAに起因

    • http://blog.airbridge.io上のイベント → デフォルトのキャンペーンに起因

個人情報の保護

SDKの初期化時にautoStartTrackingEnabledがfalseに設定されている場合、airbridge.startTrackingが呼び出されるまでイベントは送信されません。

123456
airbridge.init({
    app: 'YOUR_APP_NAME',
    webToken: 'YOUR_WEB_TOKEN',
    // ...
    autoStartTrackingEnabled: false,
})

autoStartTrackingEnabledのデフォルト値はtrueです。

保護されたアトリビューションウィンドウ

アプリがすでにインストールされている場合、ディープリンク付きボタンをクリックすると「ディープリンクオープン（アプリ）」イベントが発生します。この場合、ボタンはリエンゲージメントのタッチポイントとして表示され、イベントは「Owned Channel Type Touchpoint（airbridge.Websdk）」の一因となります。

メディアチャネルへの貢献度をクレジットするには、useProtectedAttributionWindowをtrueに設定します。

1234567
airbridge.init({
    app: '<YOUR_APP_NAME>',
    webToken: '<YOUR_WEB_TOKEN>',
    // ...
    useProtectedAttributionWindow: true,
    protectedAttributionWindowInMinutes: 60,
})

protectedAttributionWindowInMinutesのデフォルト値は30です。つまり、メディアチャネルをクリックした後でWebページを開くと、Webページを開いてから30秒以内にイベントが発生した場合に限り、「ディープリンクオープン（アプリ）」イベントがメディアチャネルにクレジットされます。protectedAttributionWindowInMinutesは最大4320（3日）まで設定することができます。

他のWebページへのジャーニーを追跡

ユーザーが他のWebサイトに移動する場合、sendWebメソッドを使用します。移動したウェブサイトにもAirbridge Web SDKがインストールされていれば、ユーザージャーニーを繋いでアトリビューションの成果を分析することができます。

useProtectedAttributionWindowは、アトリビューションを接続するためにAirbridge SDKを初期化する際にtrueに設定する必要があります。保護されたアトリビューションウィンドウを参照してください。

1234567
// Open in same window
airbridge.sendWeb("https://www.airbridge.io/blog")

// Open in new window
airbridge.sendWeb("https://www.airbridge.io/blog", function(err, res) {
  window.open(res.targetUrl)
})

Google Tag Managerの使用

Google Tag Managerを使用して、Airbridge SDKをインストールすることができます。

SDKのインストール

Google Tag Managerを使用してAirbridge SDKをインストールする場合、以下の手順に従ってください。

  1. 「Workspace Overview」の「New Tag」をクリックする、またはコンテナ内で「Tag → New」を選択します。

  2. 「Tag Configuration → Custom Settings」で「Custom HTML」を選択します。

  3. 下図に示すように、「HTML」セクションにAirbridge SDK codeのコードを挿入します。

  4. 「Tag Configuration → Advanced Settings → Tag firing priority」を選択して、0より大きい数値（9999など）を入力します。

  5. 「Tag Configuration → Advanced Settings → Tag firing Options」で「Once per page」を選択します。

  6. 「Trigger」を「Pageview - DOM Ready」に設定します。

  7. タグの作成が完了したら、送信ボタンを押します。

  8. Check the Airbridge dashboard under real-time logs to verify that the SDK logs are logged properly.

イベントの追跡

Follow these steps to track events using Google Tag Manager.

  1. 「Workspace Overview」の「New Tag」をクリックする、またはコンテナ内で「Tag → New」を選択します。

  2. 「Tag Configuration → Custom Settings」で「Custom HTML」を選択します。

  3. 下図に示すように、「HTML」セクションに追跡するイベントのコードを挿入します。

  4. イベントに応じて、「Advanced Settings > Tag firing options」で「Unlimited」、「Once per event」、「Once per page」を選択します。

  5. イベントに適切なトリガーを設定します。

  6. タグの作成が完了したら、送信ボタンを押します。

  7. リアルタイムロゴの下にあるAirbridgeダッシュボードで、SDKのロゴが適切に記録されていることを確認します。