Swift スタートガイド

このガイドでは、Swift で iOS アプリを作成して実装する方法について説明します。 Google タグで画面起動イベントとボタン押下イベントをトラッキング マネージャー(GTM)。

1. 新しいプロジェクトを作成

  1. Xcode を開きます。 新しいプロジェクトを
  2. [Create a new Xcode project] をクリックします。
  3. [Single View Application] を選択します。 シングルビュー アプリケーションを選択
  4. [次へ] をクリックします。
  5. プロジェクトに名前を付け、追加のオプションを選択します。プロジェクト名と アプリ名はプロダクト名と同じになります。
    プロダクト名とその他のオプションを入力してください
  6. [次へ] をクリックします。
  7. プロジェクトのロケーション(ディレクトリ)を選択します。
  8. [作成] をクリックします。

2. Google タグ マネージャーの依存関係をインストールする

  1. Xcode を終了します。
  2. ターミナルで、次のコマンドを実行して Cocoapods:
    $ sudo gem install cocoapods
  3. プロジェクト ディレクトリに移動します。
  4. 次のコマンドを実行して、Podfile という名前のファイルを作成します。
    $ pod init
  5. Podfileuse_frameworks! のコメント化を解除します。 ターゲットに pod 'GoogleTagManager' を追加します。
  6. # Uncomment this line if you're using Swift
    use_frameworks!
    
    target 'GtmSwiftTutorial' do
      pod 'GoogleTagManager'
    end
  7. 次のコマンドを実行して、Google タグ マネージャー(GTM)をダウンロードしてインストールします。 追加します。
    $ pod install

    このコマンドは、ワークスペース GtmSwiftTutorial.xcworkspace も作成します。 今後は、このワークスペースを使用して GtmSwiftTutorial アプリを開発します。

3. Objective-C ライブラリのブリッジング ヘッダーを追加する

ブリッジング ヘッダー ファイルを作成するには:

  1. Xcode を開きます。
  2. [ファイル] >新規 >File を使用します。
  3. [iOS] >Source で、[Header File] を選択します。
  4. [次へ] をクリックします。
  5. ヘッダー ファイル名 BridgingHeader.h を入力します。
    ブリッジング ヘッダー ファイルを作成する
  6. [作成] をクリックします。
  7. 次の import ステートメントをヘッダー ファイルに追加します。
    #ifndef BridgingHeader_h
    #define BridgingHeader_h
    
    #import <GoogleTagManager/TAGManager.h>
    #import <GoogleTagManager/TAGContainer.h>
    #import <GoogleTagManager/TAGContainerOpener.h>
    #import <GoogleTagManager/TAGDataLayer.h>
    #import <GoogleTagManager/TAGLogger.h>
    
    #endif /* BridgingHeader_h */

ビルド設定に Objective-C ブリッジング ヘッダーを追加するには:

  1. Xcode でプロジェクトをクリックします。
  2. エディタ領域で [Build Settings] をクリックします。
    [Build Settings] をクリックします。
  3. [すべて] と [統合] を選択し、「ブリッジ」を検索します。
    検索の橋渡し
  4. [Objective-C Bridging Header] を含む行の右側の列に、 「BridgingHeader.h」と入力します。
    BridgingHeader.h を Objective-C ブリッジング ヘッダーとして追加

4. プロジェクトにデフォルトのコンテナを追加する

プロジェクトにデフォルトのコンテナを追加する前に、 モバイル コンテナ バイナリをコンパイルします。

  1. <ph type="x-smartling-placeholder"></ph>にログインしてください Google タグ マネージャー アカウント。
  2. モバイル向けのコンテナを選択します。
  3. メニューバーで [バージョン] をクリックします。
  4. [操作 >選択したコンテナでダウンロード できます。
  5. ダウンロードしたファイルの名前はコンテナ ID です。 例: GTM-PT3L9Z

プロジェクトにデフォルトのコンテナ バイナリを追加するには:

  1. Xcode を開きます。
  2. Dock の Finder アイコンをクリックします。
  3. Downoloads フォルダをクリックします。
  4. コンテナ バイナリ ファイルを Downloads フォルダにドラッグ&ドロップする Xcode プロジェクトのルートフォルダにコピーします。
  1. Xcode で AppDelegate.swift ファイルを開きます。
  2. AppDelegate クラスが TAGContainerOpenerNotifier クラス:
    import UIKit
    
    @UIApplicationMain
    class AppDelegate: UIResponder, UIApplicationDelegate, TAGContainerOpenerNotifier {
      // ...
    }

    クラスを拡張すると、 Type 'AppDelegate' does not conform to protocol 'TAGContainerOpenerNotifier' エラーが発生します。このエラーは次の手順で解決します。

  3. AppDelegate クラス定義の一番下に次の関数を追加します。
    func containerAvailable(container: TAGContainer!) {
      container.refresh()
    }
  4. application 関数に、次のコードを追加します。 return true ステートメントの前に配置します。
    let GTM = TAGManager.instance()
    GTM.logger.setLogLevel(kTAGLoggerLogLevelVerbose)
    
    TAGContainerOpener.openContainerWithId("GTM-PT3L9Z",  // change the container ID "GTM-PT3L9Z" to yours
        tagManager: GTM, openType: kTAGOpenTypePreferFresh,
        timeout: nil,
        notifier: self)

6. 画面起動イベントを追跡する

画面起動イベントをトラッキングするには:

  1. トラッキング ID を格納する変数を作成します。
  2. screenName というデータレイヤー変数を作成します。
  3. Screen View」という名前の GTM タグを作成します。
  4. スクリーン トラッキング コードを追加します。

a. トラッキング ID を格納する変数を作成する

  1. Google タグ マネージャー アカウントにログインします。
  2. モバイル向けのコンテナを選択します。
  3. 左側のナビゲーション バーで [変数] をクリックします。
  4. [ユーザー定義の変数] で [新規] をクリックします。
  5. [無題の変数] をクリックして、変数名を入力します。 トラッキング ID:
  6. 変数のタイプとして [定数] を選択します。
  7. トラッキング ID を UA-XXXXXXXX-X の形式で入力します。 ここで、X は数字)を指定します。
    UA-47605289-5(削除)を使用します。
  8. [変数を作成] をクリックします。

b. screenName という名前のデータレイヤー変数を作成する

  1. Google タグ マネージャー アカウントにログインします。
  2. モバイル向けのコンテナを選択します。
  3. 左側のナビゲーション バーで [変数] をクリックします。
  4. [ユーザー定義の変数] で [新規] をクリックします。
  5. [無題の変数] をクリックしてタイトルを入力する スクリーン名:
  6. [データレイヤーの変数] を変数タイプとして選択します。
  7. [データレイヤーの変数名] に「screenName」と入力します。
  8. [デフォルト値を設定] をクリックします。
  9. デフォルト値として「unknown screen」と入力します。
  10. [変数を作成] をクリックします。

c. 「スクリーン ビュー」という名前の GTM タグを作成

  1. Google タグ マネージャー アカウントにログインします。
  2. モバイル向けのコンテナを選択します。
  3. 左側のナビゲーション バーで [タグ] をクリックします。
  4. [新規] をクリックします。
  5. [無題のタグ] をクリックしてタグ名を入力します。 スクリーン ビュー:
  6. サービスとして [Google アナリティクス] を選択します。
  7. リストから [トラッキング ID] を選択します。
  8. [トラッキング タイプ] として [アプリビュー] を選択します。
  9. [詳細設定] をクリックします。
  10. [設定フィールド] をクリックします。
  11. [+ フィールドを追加] をクリックします。
  12. フィールド名「screenName」と値「Screen Name」を選択します。
  13. [続行] をクリックします。
  14. [配信するタイミング] で [任意のイベント] を選択します。
  15. [タグを作成] をクリックします。

d. スクリーン トラッキング コードの追加

  1. Xcode で ViewController.swift ファイルを開きます。
  2. dataLayer という名前の変数を、 ViewController クラス:
    var dataLayer: TAGDataLayer = TAGManager.instance().dataLayer
  3. viewDidLoad() 関数で、 OpenScreen イベントをデータレイヤーに追加します。
    dataLayer.push(["event": "OpenScreen", "screenName": "Home Screen"])

ViewController クラスの定義は次のようになります。

import UIKit

class ViewController: UIViewController {
  var dataLayer: TAGDataLayer = TAGManager.instance().dataLayer

  override func viewDidLoad() {
    super.viewDidLoad()
    dataLayer.push(["event": "OpenScreen", "screenName": "Home Screen"])
  }

  override func didReceiveMemoryWarning() {
    super.didReceiveMemoryWarning()
    // Dispose of any resources that cant be recreated
  }
}

7. ボタンの押下イベントをトラッキング

ボタンの押下イベントをトラッキングするには:

  1. eventAction」という名前のデータレイヤー変数を作成します。
  2. Event」という名前のカスタム イベント変数を作成します。
  3. Button Pressed」という名前の GTM タグを作成します。
  4. ボタンを作成し、ボタンが押されたことを追跡するコードを追加します。

a. 「eventAction」という名前のデータレイヤー変数を作成する

  1. Google タグ マネージャー アカウントにログインします。
  2. モバイル向けのコンテナを選択します。
  3. 左側のナビゲーション バーで [変数] をクリックします。
  4. [ユーザー定義の変数] で [新規] をクリックします。
  5. [無題の変数] をクリックしてタイトルを入力する イベント アクション
  6. [データレイヤーの変数] を変数タイプとして選択します。
  7. [データレイヤーの変数名] に「eventAction」と入力します。
  8. [デフォルト値を設定] をクリックします。
  9. デフォルト値に「不明なイベント」と入力します。
  10. [変数を作成] をクリックします。

b. 「Event」という名前のカスタム イベント変数を作成する

  1. Google タグ マネージャー アカウントにログインします。
  2. モバイル向けのコンテナを選択します。
  3. 左側のナビゲーション バーで [変数] をクリックします。
  4. [ユーザー定義の変数] で [新規] をクリックします。
  5. [無題の変数] をクリックして、変数名を「Event」と入力します。
  6. 変数タイプとして [カスタム イベント] を選択します。
  7. [変数を作成] をクリックします。

c. 「Button Pressed」というタイトルの GTM タグを作成します。

  1. Google タグ マネージャー アカウントにログインします。
  2. モバイル向けのコンテナを選択します。
  3. 左側のナビゲーション バーで [タグ] をクリックします。
  4. [新規] をクリックします。
  5. [無題のタグ] をクリックしてタグ名を入力します。 ボタン押下
  6. サービスとして [Google アナリティクス] を選択します。
  7. リストから [トラッキング ID] を選択します。
  8. [トラッキング タイプ] として [イベント] を選択します。
  9. [イベント] カテゴリを選択します。
  10. [イベント アクション] を選択します。
  11. [続行] をクリックします。
  12. [配信するタイミング] で [任意のイベント] を選択します。
  13. [タグを作成] をクリックします。

d. ボタンを作成し、ボタンが押されたことを追跡するコードを追加する

  1. Xcode プロジェクトを開きます。
  2. Main.storyboard を開きます。
  3. Xcode ツールバーの右上のボタンをクリックして、 ユーティリティ エリア(右側のサイドバー)をクリックします。 ストーリーボードとユーティリティ エリア
  4. ユーティリティエリアの下部に
    オブジェクト ライブラリを開く青いボタン

    [オブジェクト ライブラリを表示] ボタン(青いボタン)をクリックします。

    オブジェクト ライブラリのポップアップ ウィンドウ
  5. 検索ボックスに「button」と入力します。
    オブジェクト ライブラリのボタン
  6. [ボタン] をストーリーボードにドラッグし、上部にドロップします。 クリックします。
    ボタンをストーリーボードにドラッグ&ドロップします
  7. アシスタント エディタ ボタンをクリックします。 アシスタント エディタのボタン
  8. Ctrl キーを押しながら、ボタンをドラッグ&ドロップする ViewController クラス定義の一番下にあります。
    ボタンを ViewController クラス定義にドラッグ&ドロップします。
  9. ダイアログで [アクション] 接続を選択し、関数名を入力します。 buttonPressed を選択し、[buttonPressed] をクリックします。
    ボタン押下イベントを処理するコードを作成する

    これにより、末尾に次の関数が追加されます。 ViewController クラスの定義:

    @IBAction func buttonPressed(sender: AnyObject) {
    }

    この関数は、ボタンが押されるたびに実行されます。

  10. buttonPressed 関数で、次のコードを ButtonPressed イベントを日のレイヤにプッシュします。
    @IBAction func buttonPressed(sender: AnyObject) {
      dataLayer.push(["event": "ButtonPressed", "eventAction": "Test Event"])
    }

8. アプリをビルドして実行する

Xcode で [Product] >実行。Xcode はアプリをビルドして実行します。

起動されたアプリのスクリーンショット