제목
GTM 요소 공개 상태 질문입니다!
작성자
에라취오르
작성일
2022-04-26 18:07
조회
1332
답변완료

요소 공개 상태 트리거의 경우 페이지당 한번 발생 하나요?

설정할 때 요소당 한번으로 해도 첫 페이지에서만 잡히고 잡히지 않아서요 ㅠㅠ

개발 언어가 리액트인데 리액트의 특성일 수 도 있을까요?

콘텐츠를 소비했는지를 트래킹 하고 싶어서 요소 공개나 스크롤 깊이 모두 사용해보았는데 처음만 잡히고 새로고침 전까진 잡히지 않습니다ㅠㅠ

리액트에서 해결할 수 있는 방안이나 혹은 다른 트리거를 이용해서 해결할 수 있는지 궁금합니다ㅠㅠ

전체 3

  • 2022-04-27 12:38

    안녕하세요, 에라취오르님!
    리액트의 경우에는 일반적으로 페이지가 최초에 1번 로드되고, 이후의 화면 변화는 페이지가 아닌 동일한 페이지에서 컴포넌트가 변경되는 것이기 때문에,
    페이지 변화가 주된 기준인 GTM의 기능들을 사용하기 까다롭습니다.

    GTM은 페이지가 로드되는 시점에 트리거와 관련된 셋팅들이 작동하는 구조이므로, 리액트와 같은 SPA를 사용할 때는 추가적인 작업이 필요합니다.
    아래 설명드리는 방법은 이전에 스크롤 깊이 트리거를 사용했을 때의 방법인데, 요소 공개 상태 트리거도 동일하게 적용되는지는 테스트를 해보셔야 할 것 같습니다.

    [트리거 제작]
    - 트리거 유형 : 기록 변경 ( SPA에서 History가 변경될 때마다 발동하는 트리거 )

    [태그 제작]
    - 태그 유형 : 맞춤 HTML
    - 트리거 : 위에서 생성한 트리거를 연결
    - 태그 내용 :

    1
    2
    3
    4
    5
    6
    <script>
     window.dataLayer = window.dataLayer || [];
     window.dataLayer.push({
     'event': 'gtm.load'
     });
    </script>

    이 방법의 원리는 GTM에 'gtm.load'라는 이벤트를 직접 전달하여, 리액트에서 화면이 바뀔때마다 스크롤 설정을 초기화시키는 것입니다.

    + SPA에서 요소 공개 상태 트리거를 사용할 떄는 [DOM 변경사항 준수]를 반드시 체크하셔야 하고, 가능하면 요소 조건을 세부적으로 입력하시는게 좋습니다!


  • 2022-04-28 14:54

    알려주신 방법으로 하니, 요소 공개 상태 트리거도 동일하게 초기화 되어서 작동하는것 같습니다! 그러나, 궁금한 부분이 요소 공개 상태 트리거에서 id로 설정할 경우 div 내부에 id값만 사용 가능한가요? 예를 들면, div내부 class나 그 외에 다른 것들은 안 먹는지 궁금하빈다 ㅠㅠ