이벤트 수집 / UTM

담당자

사용부서

선택

사용안함

솔루션

코드앤버터

확인 필요

코드앤버터도 연쇄적으로 이벤트 수집이 가능해보입니다. (테스트 전)

다만, 아임웹 탈리 / 코드 삽입 / utm 설정으로 인앱 유입 → 지원서 지원까지 전환 확인을 하는 방법이 나을 듯 하여,

현재는 고려하고 있지 않습니다.

버튼 카운트 지표 이벤트 수집

    <style>
        .more_layout {
            display: flex;
            justify-content: center; /* 우측에 정렬 */
            align-items: center; /* 세로 중앙 정렬 */
        }

        .more {
            display: flex;
            cursor: pointer;
            align-items: center;
            justify-content: center;
            width: 100px;
            font-size: 13px;
            padding: 10px 6px;
            height: 26px;
            border-radius: 4px;
            font-weight: 400;
            color: #616161;
            background-color: #F6F6F6;
        }

        /* hover 시 색상 변경 */
        .more:hover {
            color: #7062E1;
            background-color: #E4E5E9;
        }
    </style>
</head>
<body>
    <div class="more_layout">
        <div class="more" id="moreButton">더보기</div>
    </div>

    <script>
        document.getElementById('moreButton').addEventListener('click', function() {
            CodenButter("event", { name: "goal|bjurvypplj" }); // 이벤트 실행
            window.location.href = 'https://wannago.oopy.io/program/20'; // 페이지 이동
        });
    </script>
</body>
</html>
HTML
복사

연쇄 이벤트 지표

테스트 과정 referrer가 있어야 수집 가능할 것 같다.

<!DOCTYPE html>
<html lang="en">
<head>

    <style>
        .more_layout {
            display: flex;
            justify-content: center; /* 중앙 정렬 */
            align-items: center; /* 세로 중앙 정렬 */
        }

        .more {
            display: flex;
            cursor: pointer;
            align-items: center;
            justify-content: center;
            width: 100px;
            font-size: 13px;
            padding: 10px 6px;
            height: 26px;
            border-radius: 4px;
            font-weight: 400;
            color: #616161;
            background-color: #F6F6F6;
        }

        /* hover 시 색상 변경 */
        .more:hover {
            color: #7062E1;
            background-color: #E4E5E9;
        }
    </style>
</head>
<body>
    <div class="more_layout">
        <div class="more" id="moreButton">더보기</div>
    </div>

    <script>

        // 유입 경로에 따른 이벤트 발생 후, 클릭 이벤트 발생
        document.getElementById('moreButton').addEventListener('click', function() {
            var referrer = document.referrer;
                    console.log('Referrer:', referrer); // 유입 경로를 콘솔에 출력
            if (referrer.includes('https://yeswecan.oopy.io/043d1ec5-2d54-4145-8ec5-749d72158f71')) {
                // 유입 경로 이벤트가 이미 발생한 경우
                CodenButter("event", { name: "goal|bjurvypplj" });
            } else {
                // 유입 경로 이벤트가 발생하지 않은 경우
                CodenButter("event", { name: "goal|ojkjbkbbvp" });
            }
            
            // 이벤트 발생 후 페이지 이동 (0.5초 대기)
            setTimeout(function() {
                window.location.href = 'https://wannago.oopy.io/program/20';
            }, 500); // 500ms 대기 후 페이지 이동
        });
    </script>
</body>
</html>

HTML
복사

<!DOCTYPE html>
<html lang="en">
<head>

    <style>
        .more_layout {
            display: flex;
            justify-content: center; /* 중앙 정렬 */
            align-items: center; /* 세로 중앙 정렬 */
        }

        .more {
            display: flex;
            cursor: pointer;
            align-items: center;
            justify-content: center;
            width: 100px;
            font-size: 13px;
            padding: 10px 6px;
            height: 26px;
            border-radius: 4px;
            font-weight: 400;
            color: #616161;
            background-color: #F6F6F6;
        }

        /* hover 시 색상 변경 */
        .more:hover {
            color: #7062E1;
            background-color: #E4E5E9;
        }
    </style>
</head>
<body>
    <div class="more_layout">
        <div class="more" id="moreButton">더보기</div>
    </div>

    <script>

        // 유입 경로에 따른 이벤트 발생 후, 클릭 이벤트 발생
        document.getElementById('moreButton').addEventListener('click', function() {
            var referrer = document.referrer;
                    console.log('Referrer:', referrer); // 유입 경로를 콘솔에 출력
            if (referrer.includes('www.wannago.co.kr/')) {
                // 유입 경로 이벤트가 이미 발생한 경우
                CodenButter("event", { name: "goal|bjurvypplj" });
            } else {
                // 유입 경로 이벤트가 발생하지 않은 경우
                CodenButter("event", { name: "goal|ojkjbkbbvp" });
            }
            
            // 이벤트 발생 후 페이지 이동 (0.5초 대기)
            setTimeout(function() {
                window.location.href = 'https://wannago.oopy.io/program/20';
            }, 500); // 500ms 대기 후 페이지 이동
        });
    </script>
</body>
</html>
HTML
복사