Google 태그 관리자를 통한 Google 분석(GA4)을 사용한 손쉬운 양식 이벤트 추적

귀하는 이미 Google Analytics 버전 3 및 Effortless Forms 통합에 대해 잘 알고 있습니다. 을 고려하면 Google 분석 4 는 "Universal Analytics"로 알려진 버전 3보다 더 새롭고 약간 더 복잡하며 다릅니다. 이해를 돕기 위해 처음에 버전 3 가이드를 검토하는 것이 좋습니다. 그러나 처음이고 이 가이드를 직접 따르는 경우 아무런 문제가 발생하지 않습니다. 우리는 Google 태그 관리자를 통한 Google 분석과 같은 주요 플랫폼을 통해 Effortless Forms의 강력한 통합 및 분석 기능을 선보일 수 있는 적절하고 간단한 단계를 제공하는 것을 목표로 합니다.

더 이상 서문이 없습니다. 뛰어들어보자!

먼저 Google 태그 관리자(GTM) 및 Google 분석(GA)이 웹사이트 데이터와 어떻게 협력하거나 다양한 플랫폼에서 데이터를 공유하는지 살펴보겠습니다.

이 튜토리얼에서는 Google 태그 관리자를 사용하여 Effortless Forms 이벤트(양식 보기 및 양식 제출)의 2가지 변형을 추적한 후 시각적 표현 및 추가 조사를 위해 해당 이벤트를 GA에 전송합니다. GTM을 통해 양식 이벤트를 모니터링하는 여러 기술이 있습니다. 간편한 양식은 고유한 양식 상태에서 jQuery 이벤트를 트리거하여 사용자 정의 코드를 통해 Google 태그 관리자로 이벤트 추적 프로세스를 단순화하고 미리보기 모드와 같이 GTM 내에서 고급 문제 해결이 필요하지 않도록 합니다.

Google 태그 관리자가 웹사이트의 모든 페이지에 전체적으로 설치되어 있다고 가정합니다. GTM을 통해 Effortless Forms 이벤트 추적을 구현하려면 아래 지침을 주의 깊게 따르십시오.

다음은 Effortless Forms Events를 위해 GTM 내에서 상호 작용하고 데이터를 Google Analytics로 전달하는 요소에 대한 분석입니다.

태그

트리거

변수

3(필수 2개, 선택 1개)

유형

cHTML,
GA 4 구성

맞춤 이벤트

2 데이터 레이어,
1 자바스크립트

또한 Effortless Forms에서 발생하는 이벤트 유형을 구별하기 위해 기존 변수 [이벤트]를 활용할 것입니다.

1. 손쉬운 형태 변수 제작 :

변수는 속성과 나타나는 해당 값을 정의하기 위해 다양한 데이터 유형을 나타냅니다. 또는 홈페이지에서 발송됩니다.

귀하의 Google 태그 관리자 대시보드, 다음으로 이동 변수, 그 다음 아래 사용자 정의 변수, 을 클릭하세요 새로운 단추.

당신의 속성 변하기 쉬운 다음과 유사해야 합니다.

제목

EffortlessFormID

변수 유형

데이터 영역 변수

데이터 영역 변수 이름

EffortlessFormID

데이터 영역 버전

버전 2

만들다 또 다른 변수 다음 설정을 사용합니다.

제목

EffortlessForm이벤트액션

변수 유형

데이터 영역 변수

데이터 영역 변수 이름

이벤트액션

데이터 영역 버전

버전 2

[선택] 설정 또 다른 변수 다음 구성을 사용하여 양식 페이지 제목:

2. 간편한 양식 트리거 공식화:

트리거는 GTM이 의도에 따라 작업을 실행할 시기를 정확하게 식별하는 데 가장 중요합니다. 예를 들어 웹페이지가 Effortless Form으로 로드될 때 누군가가 Effortless Form을 제출하면 GTM은 어떻게 합니까?

Effortless Forms를 위한 트리거를 설계하려면, 트리거 방문 그리고 새로운 아래 그림과 같이 트리거합니다.

그 후, 의도한 트리거에 대해 다음 세부 사항을 준수하십시오.

제목

EffortlessForm활동이벤트

이벤트 유형

맞춤 이벤트

이벤트 이름

손쉬운 형태활동

트리거 실행 대상

모든 맞춤 이벤트

3. 손쉬운 형태 제작 태그:

태그는 Google Tag Manager로 실행하는 기능을 나타냅니다. 태그는 다양한 유형으로 제공되며 요구 사항에 따라 구성됩니다. 트리거가 태그에 정의된 작업을 활성화하고 실행할 때 자동화된 작업과 유사합니다.

우리는 Google 분석: GA4 구성 유형 꼬리표 웹사이트에서 양식 이벤트 데이터를 전송하려면 사용자 정의 JavaScript 스니펫 웹페이지에 추가되거나 다른 것을 사용하여 GTM 자체에 의해 추가됩니다. 맞춤 HTML 태그 유형.

먼저 맞춤 HTML 다음 단계에 따라 태그를 지정하세요.

향하다 태그 그리고 클릭 새로운

선택하다 태그 유형 ~처럼 맞춤 HTML 제공된 맞춤 코드를 아래 제공된 데이터와 함께 GTM 코드 편집기에 삽입합니다.

제목

cHTML – EffortlessFormsDataPush

태그 유형

맞춤 HTML

<script>
   (function($){
     var effortlessForms = $('.frm-fluent-form');
     effortlessForms.each(function() {
       var ``form = ``(this);
       var formId = $form.attr('data-form_id');
       dataLayer.push({
        'event': 'EffortlessFormActivities',
        'eventCategory': 'EffortlessForm',
        'eventAction': 'FormView',
        'EffortlessFormID' : formId
      });
   $form.on('effortlessform_submission_success', function() {
     dataLayer.push({
       'event': 'EffortlessFormActivities',
       'eventCategory': 'EffortlessForm',
       'eventAction': 'FormSubmitted',
       'EffortlessFormID' : formId
     });
   });
  });
 }(jQuery));
</script>

코드를 삽입한 후 트리거링 필드 및 선택 발사 트리거 ~처럼 페이지 보기 [ 모든 페이지 ] 아래 그림과 같이:

이제 목표 달성이 거의 가까워졌으며 이벤트 데이터를 검색한 다음 이를 Google Analytics로 전달할 하나의 최종 태그를 생성해야 합니다. 또한 Google Analytics로 전달될 속성의 형식을 지정합니다.

다시, 방문하다 태그 그리고 선택 Google 태그 아래 그림과 같이:

그 후, Google 분석 4 측정 ID 설정 변수를 구성합니다.

제목

EffortlessForms – GA4

태그 유형

Google 분석: GA4 구성

측정 ID

G-XXXXXXXX [지침을 따르세요.

[다음 코드 조각을 복사하세요]

입력할 정보:

디스플레이 모드

진실

디버그 보기를 활성화하려면

이벤트 종류

사용자 정의로 선택

이벤트 절차

사용자 정의로 선택

시트 번호

사용자 정의로 선택

양식닉네임

사용자 정의로 선택

Google Analytics 4 식별 ID

취득하려면 Google 분석 4 식별 ID, 다음 절차를 따르시기 바랍니다.

당신의 집으로 가세요 Google 분석 대시보드 그리고를 클릭하세요 관리자 (구성 아이콘 페이지 왼쪽 하단에 있음)

그런 다음 대상 계정을 선택하거나 선호하는 세부 사항으로 새로운 계정을 만드십시오. 또한 이미 보유하고 있는 경우 기존 소유물을 선택하거나 선호하는 세부 사항으로 새 소유물을 생성하세요. 소유 이름 아래에서 데이터 스트림 옵션에 액세스할 수 있습니다. 계속해서 선택하세요.

그다음에는 새로운 것을 만들어라. 데이터 흐름 사이트가 아직 설정되지 않은 경우 온라인으로 설정됩니다. 관련 제공 URL(Uniform Resource Locator) 프로토콜과 스트림 지정.

[자발적] 그럼, 구성 아이콘 Fluent Forms 이벤트 모니터링에만 필수적인 데이터를 선별합니다. 페이지 조회수만이 중요합니다. 다른 데이터 범주가 추가되면 Google 분석에 관련 없는 정보가 도입되며 이는 Fluent Forms 이벤트에 필요하지 않습니다.