Google Analyticsのトラッキングコードをフォームに組み込む(Google アナリティクス4)
SmoothContactはGoogleが提供する無料のアクセス解析サービス「Google Analytics」に対応しています。
SmoothContactでのGoogle Analyticsの連携についてUAでは、コンバージョン計測を行うためにUAのトラッキングコードを設定時に到達ページURLへ、「/smoothcontact/～フォームID～」を設定しておりますがGoogle アナリティクス4（GA4）対応については、以下の設定が必要となります。
解析可能な情報は、Googleアナリティクスの仕様に準じます。GoogleアナリティクスのGoogleタグで取得手順については本記事で参考情報を記載しておりますが、詳細についてはサポート外の内容となります。取得手順が不明な場合はGoogleのヘルプページをご確認ください。
Google Analyticsのアカウントを取得する
以下のGoogleアナリティクスにログインをします。
■Googleアナリティクス
https://analytics.google.com/
Googleアカウントの画面が表示されます。すでにGoogleアカウント（Gmailアドレス）を持っている場合はそれを入力し［1］、〈ログイン〉をクリックします［2］。まだ取得していない場合は〈アカウントを作成〉をクリックして取得してください。
新規アカウントを作成した場合、「アカウントを作成」から新しいアナリティスクアカウントを作成します。
プロパティを作成します。
ビジネスの説明を設定します。
ビジネス目標を選択します。
利用規約へ同意します。
プラットフォームを選択します。「今回をスキップ」を選択した場合もアカウントを作成後にプラットフォーム選択は行えます。
ホームに移動を選択し管理画面へと移動します。
Googleタグを取得する
Googleタグを取得します。管理画面で左下の「管理」アイコンをクリックします。
「データストリーム」を選び[1]、「ストリームを追加」を選択[2]。「ウェブ」を選択します[3]。
「データストリーム ＞ ウェブストリーム」の設定で「ウェブサイトのURL」へURLを設定。「ストリーム名」を設定した後に「ストリームを作成」を選択します。
「ウェブサイトのURL」へ設定するURLはサイト内へフォームパーツを設置する場合とフォームの
URLをリンクで設定頂いている場合で、それぞれ異なります。
設定頂くURLは以下の通りとなりますので、対応するURLを設定します。サイト内へフォームパーツを設定する場合：公開サイトのURL
フォームのURLをリンクで設定する場合：https://smoothcontact.jp/
「ウェブストリームの詳細」画面から「Googleタグ」-「タグの実装手順を表示する」を選択します。
対象のGoogleタグをコピーし、テキストエディタなどにメモします。
Googleタグを設定する
取得したGoogleタグは、「サイト内へフォームパーツを設置する場合」と「サイト内に「フォーム」パーツを設置せず、SmoothContactの「フォームのURL」をリンクで設定している場合」で、設定方法が異なります。それぞれの設定方法は以下の通りとなります。
サイト内へフォームパーツを設置する場合
「サイト設定」からサイト設定画面を開きます。
〈アクセス解析設定〉タブを選択します。
取得したGoogleタグを〈アクセス解析設定〉タブ内の「head内」へ入力します。
Googleタグを入力後、タグの反映を行うため「サイトを公開」よりサイトアップロードを行います。
「ウェブストリームの詳細」画面から「カスタムイベントの作成」を選択します。
「イベントの作成」画面から「作成」を選択します。
設定画面で以下の設定を行い「作成」を選択します。
設定後は「保存」を選択します。
カスタムイベント名：任意のイベント名
パラメータ：page_path
演算子：次を含む
値：(/smoothcontact/～フォームID～)
上部の値へ入力するURLについては、SmoothContactのフォーム編集画面内「詳細設定」タブ「外部サービスのタグ設定」の「GoogleAnalyticsのトラッキングコードを入力」欄から確認が行えます。「サイト内へフォームを設置する場合」と「独立したURLでフォームを使用する場合」でURLが異なります。「サイト内へフォームを設置する場合」は【A】の(/smoothcontact/～フォームID～)を値に設定してください。
Googleアナリティスク画面から「コンバージョン」を選択します。
「新しいコンバージョンイベント」を選択します。
「新しいイベント名」へはカスタムイベントで設定した任意のイベント名と同じイベント名を設定し、保存を選択します。
サイト内に「フォーム」パーツを設置せず、SmoothContactの「フォームのURL」をリンクで設定している場合
Googleアナリティクス「データストリーム ＞ ウェブストリーム」の設定で「ウェブサイトのURL」へ「https://smoothcontact.jp/」を設定します。「ストリーム名」を設定した後に「ストリームを作成」を選択します。
「ウェブストリームの詳細」画面から「Googleタグ」-「タグの実装手順を表示する」を選択します。
対象のGoogleタグをコピーし、テキストエディタなどにメモします。
データストリーム内の「タグの実装手順を表示する」より、取得した「Googleタグ」を、フォームの「編集」-「詳細設定」より、「サイト内にフォームパーツを設置せず、独立したURLでフォームを利用している場合」 入力欄に張り付けます。
「ウェブストリームの詳細」画面から「カスタムイベントの作成」を選択します。
「イベントの作成」画面から「作成」を選択します。
設定画面で以下の設定を行い「作成」を選択します。
設定後は「保存」を選択します。
カスタムイベント名：任意のイベント名
パラメータ：page_location
演算子：次を含む
値：(https://smoothcontact.jp/front/complete/〜フォームID〜)
上部の値へ入力するURLについては、SmoothContactのフォーム編集画面内「詳細設定」タブ「外部サービスのタグ設定」の「GoogleAnalyticsのトラッキングコードを入力」欄から確認が行えます。「サイト内へフォームを設置する場合」と「独立したURLでフォームを使用する場合」でURLが異なります。「独立したURLでフォームを使用する場合」は【B】の(/https://smoothcontact.jp/front/complete/〜フォームID〜)を値に設定してください。
Googleアナリティスク画面から「コンバージョン」を選択します。
「新しいコンバージョンイベント」を選択します。
「新しいイベント名」へはカスタムイベントで設定した任意のイベント名と同じイベント名を設定し、保存を選択します。
