코드 스니펫

테마 파일을 수정하지 않고 헤드, 본문, 푸터, 비활성 보관 영역에서 분석 ID와 사용자 지정 코드 스니펫을 관리하세요.

개요

코드 스니펫은 테마를 수정하지 않고 분석 코드와 사용자 지정 추적 코드를 중앙에서 관리할 수 있게 해 줍니다. 스크립트 배치에 더 많은 제어가 필요한 마케터, 에이전시, 사이트 소유자에게 유용합니다.

관리 경로: Airygen SEO -> 설정 -> 코드 스니펫

이 모듈은 Google Analytics 4와 Google Tag Manager용 기본 필드, 그리고 사용자 지정 스니펫을 위한 드래그 앤 드롭 관리기를 포함합니다.

설정

이 화면은 기본 추적 영역과 사용자 지정 스니펫 영역으로 구성됩니다.

기본 추적

  • Google Analytics 4에는 활성화 토글과 측정 ID 필드가 있습니다.
  • 측정 ID는 보통 G-로 시작합니다.
  • Google Tag Manager에는 활성화 토글과 컨테이너 ID 필드가 있습니다.
  • 컨테이너 ID는 보통 GTM-으로 시작합니다.

사용자 정의

  • 스니펫 추가는 재사용 가능한 사용자 지정 스니펫을 만드는 모달을 엽니다.
  • 헤드는 스니펫을 <head> 영역에 배치합니다.
  • 본문은 스니펫을 <body> 바로 뒤에 배치합니다.
  • 푸터는 스니펫을 </body> 앞에 배치합니다.
  • 비활성 스니펫 보관 영역은 현재 렌더링하고 싶지 않은 스니펫을 보관합니다.
  • 스니펫 모달에는 상태, 설명, 코드, 삽입 위치 필드가 있습니다.
  • 설명은 내부 참고용이며 프런트엔드에는 표시되지 않습니다.
  • 코드는 스니펫 내용만 입력해야 합니다.
  • 도움말 문구는 <script> 태그를 넣지 말라고 안내합니다.
  • 삽입 위치는 헤드, 본문, 푸터, 비활성을 지원합니다.
  • 스니펫은 영역 간에 드래그해 이동하고, 같은 영역 안에서 순서를 바꿀 수 있습니다.
  • 비활성 스니펫은 더 이상 필요하지 않으면 삭제할 수도 있습니다.

사용 방법

  1. Airygen SEO -> 설정 -> 코드 스니펫을 엽니다.
  2. Google Analytics 4를 사용한다면 Google Analytics 4를 켜고 측정 ID를 붙여넣습니다.
  3. Google Tag Manager를 사용한다면 Google Tag Manager를 켜고 컨테이너 ID를 붙여넣습니다.
  4. 사용자 정의에서 스니펫 추가를 클릭해 재사용 가능한 사용자 지정 코드 항목을 만듭니다.
  5. 모달에서 스니펫 상태를 정하고, 설명을 입력하고, 코드를 붙여넣고, 삽입 위치를 선택합니다.
  6. 스니펫을 저장한 뒤 필요에 따라 헤드, 본문, 푸터, 비활성 스니펫 보관 영역으로 드래그합니다.
  7. 설정상 출력 순서가 중요하다면 같은 영역 안에서 스니펫 순서를 조정합니다.
  8. 모듈을 저장하고 페이지 소스나 브라우저 도구에서 코드가 올바른 위치에 출력되는지 확인합니다.

저장 후에는 다음 항목을 확인하세요.

  • GA4와 GTM ID가 정확히 입력되었습니다.
  • 사용자 지정 스니펫이 의도한 출력 영역에 나타납니다.
  • 비활성 스니펫은 프런트엔드에 렌더링되지 않습니다.
  • 다른 플러그인이나 테마가 같은 분석 코드를 중복 출력하지 않습니다.

SEO 이점

이 모듈이 직접 순위를 올리지는 않지만, 분석 및 추적 설정을 더 안정적으로 유지하게 해 줍니다. 이는 유기적 성과 측정, SEO 변경 검증, 태그 배치 일관성 유지에 도움이 됩니다.

활용 사례

더 깔끔한 분석 설정이 필요한 마케터

이전에는 GA4와 GTM을 넣기 위해 테마 수정이나 여러 플러그인에 의존해야 했습니다.

이후에는 코드 스니펫이 주요 추적 ID와 사용자 지정 태그를 한곳에 모아 설정과 유지 관리를 쉽게 합니다.

일시적인 캠페인 스크립트를 관리하는 에이전시

이전에는 런칭 또는 캠페인용 스니펫을 잠시 중단하고 싶어도 완전히 삭제하지 않고는 관리하기 어려웠습니다.

이후에는 비활성 스니펫 보관 영역이 해당 스니펫을 나중에 다시 쓸 수 있도록 보관하면서도 실제 사이트에는 출력하지 않게 해 줍니다.

자주 묻는 질문

스니펫을 삭제하지 않고 비활성화할 수 있나요?

예. 비활성으로 옮기거나 스니펫 편집기에서 상태를 꺼 두면 됩니다.

코드 필드에 전체 <script> 태그를 붙여넣어야 하나요?

아니요. 도움말 문구는 코드만 붙여넣고 <script> 태그는 포함하지 말라고 안내합니다.

헤드, 본문, 푸터의 차이는 무엇인가요?

페이지 출력에서 스니펫이 들어갈 위치를 제어합니다. 각각 head 안, body가 열린 직후, body가 닫히기 직전입니다.