픽셀 마이그레이션

스토어에서 이전에 theme.liquid, checkout.liquid(Plus 판매자만 해당), 결제 설정의 추가 스크립트와 같은 위치에 픽셀을 수동으로 추가한 적이 있으면 Shopify 앱 픽셀이나 사용자 지정 픽셀과 호환되도록 픽셀을 마이그레이션할 수 있습니다. 기존 픽셀을 마이그레이션하면 다음과 같은 이점이 있습니다.

• 고객 이벤트를 간편하게 추적(고객 이벤트 등)
• 내장된 도구를 사용한 개인정보 보호 규정 준수

Shopify 픽셀 관리자에 대해 알아보고, Shopify 앱 픽셀이나 사용자 지정 픽셀로 마이그레이션했을 때의 모든 이점을 알아보십시오.

참고 사항

이 페이지는 수동으로 추가된 픽셀을 마이그레이션하는 데 도움이 되는 일반적인 가이드라인입니다. 픽셀에 따라 단계가 다양하며 Shopify에서 지원되지 않을 수 있습니다. 자세한 지침은 각 타사 픽셀 설명서를 참조해야 합니다.

픽셀 마이그레이션 준비

고객 이벤트의 중복이나 누락을 방지하기 위해서는 스토어가 바쁘지 않은 기간에 픽셀을 마이그레이션하는 것이 좋습니다.

새 사용자 지정 픽셀은 기존 픽셀 코드를 삭제하기 전이나 후에 연결할 수 있습니다. 마이그레이션 워크플로를 사용할 때 고려할 사항은 다음과 같습니다.

• 고객 이벤트의 누락을 최소화하려면 기존 픽셀을 제거하기 전 새 사용자 지정 픽셀을 연결하십시오.
• 고객 이벤트 추적의 중복을 방지하려면 기존 픽셀을 제거한 후에 새 사용자 지정 픽셀을 연결하십시오.

기존 픽셀을 앱 픽셀과 호환되도록 마이그레이션하기

참고 사항

앱 픽셀을 설치하고 아직 추가 코드를 추가하지 않은 경우에는 마이그레이션하거나 변경할 필요가 없습니다. 이 경우 앱 개발자에 의해 자동으로 개선 사항이 픽셀 통합에 적용됩니다.

아래 두 조건에 모두 해당하는 경우 기존 픽셀을 앱 픽셀과 호환되도록 마이그레이션하는 것이 좋습니다.

• 고객 이벤트를 자동으로 수집하는 Shopify 앱 픽셀이 설치되어 있습니다.
• 앱 픽셀에 의해 추적되지 않는 사용자 지정 이벤트용 추가 코드를 추가했습니다.

이 경우 앱 개발자의 지침에 따라 기존 픽셀을 마이그레이션해야 합니다.

기존 픽셀을 사용자 지정 픽셀로 마이그레이션하기

다음 두 조건이 모두 적용되는 경우 기존 픽셀을 사용자 지정 픽셀로 마이그레이션하는 것이 좋습니다.

• Shopify 앱이 설치되지 않은 상태에서 이전에 코드를 수동으로 작성하여 설치한 픽셀이 있습니다.
• 요구 사항을 충족하는 Shopify 앱 픽셀이 없습니다.

단계

1. 필수 표준과 사용자 지정 고객 이벤트를 구독하는 사용자 지정 픽셀을 생성합니다.

2. 결제 설정의 추가 스크립트나 Liquid 파일에서 기존에 추가된 픽셀 코드를 제거 또는 교체합니다. 여기에는 다음이 포함될 수 있습니다.

   • Javascript SDK가 포함된 기존 픽셀 코드를 찾아 제거합니다.
   • 표준 이벤트를 수집하는 기존 픽셀 코드를 찾아 제거합니다.
   • 비표준 이벤트를 수집하는 기존 픽셀 코드를 찾아 제거합니다.

3. 사용자 지정 픽셀을 스토어에 추가합니다.

4. 사용자 지정 픽셀을 연결합니다.

기존 픽셀 코드 찾기

기존 픽셀을 마이그레이션하려면 이를 제거하거나 수정할 수 있도록 기존 픽셀 코드를 찾아야 합니다. 대부분의 픽셀에서 찾아야 하는 두 가지 구성요소는 다음과 같습니다.

• 기본 Javascript SDK
• 고객 이벤트 추적을 위한 기능(1개 이상)

픽셀 Javascript SDK의 기존 인스턴스 찾기

Javascript SDK란 기능의 픽셀 라이브러리를 불러오는 모든 픽셀에서 제공되는 기본 코드 세트입니다. 일반적으로 픽셀을 추가할 때 온라인 스토어에 배치해야 하는 첫 번째 코드 조각을 말합니다.

Javascript SDK는 주로 머리글에 배치되지만, theme.liquid나 결제 설정의 추가 스크립트에서도 찾을 수 있습니다.

Shopify Plus

Shopify Plus 판매자는 checkout.liquid에서도 기존 Javascript SDK를 확인해야 합니다.

고객 이벤트 수집을 위한 기존 픽셀 코드 찾기

고객 이벤트를 추적하기 위해 기존 픽셀을 찾으려면 타사 픽셀 설명서에서 고객 이벤트가 저장된 위치를 찾는 방법과 검색 위치를 확인해야 합니다. 예를 들어, Meta 픽셀에는 fbq()라고 하는 방법이 사용되며, Google 픽셀은 주로 gtag()이나 dataLayer.push()을 사용합니다.

일반적으로 이 코드는 테마의 liquid 파일에서 찾을 수 있으며, 추가 스크립트는 결제 설정에서 찾을 수 있습니다.

기존 픽셀 코드의 제거 및 교체

기존 픽셀 코드를 찾은 후에는 픽셀이 추적하는 이벤트 종류에 따라 다음과 같이 코드를 제거하거나 Shopify의 Shopify.analytics.publish()로 교체해야 합니다.

• 검색한 Javascript SDK의 모든 인스턴스는 제거할 수 있습니다.
• 기존 픽셀이 표준 고객 이벤트를 추적하는 경우, 또는 추가하려는 사용자 지정 픽셀이나 앱이 표준 고객 이벤트 수집을 지원하는 경우에는 그 코드를 제거해야 합니다.
• 기존 픽셀이 사용자 지정 고객 이벤트를 추적하고, 추가하려는 사용자 지정 픽셀이나 앱이 사용자 지정 고객 이벤트 수집을 지원하는 경우에는 그 코드를 교체해야 합니다.

다음은 비표준 고객 이벤트를 추적하는 기존 픽셀 코드의 예제입니다.

<script>fbq("trackCustom", "my_custom_event");</script>

다음은 위의 코드에 해당하는 교체용 코드입니다.

<script>Shopify.analytics.publish("my_custom_event");</script>

사용자 지정 픽셀을 생성하는 경우에는 아래의 예제처럼 사용자 지정 이벤트를 사용하는 코드가 포함되어야 합니다.

analytics.subscribe("my_custom_event", event => { fbq("trackCustom", "my_custom_event"); });