Shopify(빈티지 테마 및 헤드리스)에서 Klaviyo 리뷰를 설치하는 방법

예상 4분 읽기

업데이트 2025년 8월 6일 AM 12:00 EST

학습 내용

빈티지 Shopify 테마 또는 헤드리스 아키텍처에서 Klaviyo 리뷰를 설치하는 방법을 알아보세요. 이 프로세스에서는 여러 코드 조각을 복사해 사이트 코드에 붙여넣어야 해요.

Shopify 2.0 테마를 사용 중이라면 코드를 사용하지 않고 Klaviyo 리뷰를 설치할 수 있어요. 자세한 내용은 Klaviyo 리뷰 시작하기에 대한 도움말을 참조하세요. WooCommerce를 사용한다면 WooCommerce용 Klaviyo 리뷰를 설치하는 방법을 알아보세요.

이 프로세스에서는 Shopify에서 테마 파일을 직접 편집해야 합니다. 직접 진행하기가 부담스럽다면 개발자에게 문의하거나 Klaviyo 파트너에게 문의 하여 도움을 받으세요.

시작하기 전에 알아야 할 것

사이트 코드에 이 코드 조각을 붙여넣기 전에, Shopify 스토어에 Klaviyo 리뷰 앱을 추가 해 주세요. 빈티지 테마의 경우 Klaviyo의 온사이트 트래킹을 활성화해 주세요.

Shopify에서 헤드리스 아키텍처로 설치하기

헤드리스 Shopify 스토어에 Klaviyo 리뷰를 통합하려면 Klaviyo.js라고도 하는 Klaviyo의 JavaScript 트래킹 스니펫을 리뷰 위젯을 추가하려는 모든 페이지(예: 제품 페이지)에 추가해 주세요. Klaviyo의 온사이트 트래킹 또는 가입 양식을 구성했다면 이미 이 스니펫을 설치했을 수도 있어요.

Shopify 스토어용 Klaviyo.js를 설치하는 방법을 알아보세요.

이 스크립트를 사이트에 추가한 후, 아래 단계의 코드 조각을 사이트 코드에 복사해 진행해 주세요.

코드 조각을 추가하세요.

아래 코드 조각을 사용하면 특정 리뷰 위젯이 스토어의 다양한 영역에 표시되도록 할 수 있어요.

별점 위젯은 특정 제품의 현재 별점을 표시하며, 보통 제품명 아래에 설치돼요.
리뷰 요약 위젯은 제품에 대해 선택된 모든 평점을 세부적으로 보여주는 차트, 리뷰와 함께 제출된 사용자 이미지, 그리고 제품이 받은 가장 일반적인 피드백을 보여줘요. 일반적으로 제품 페이지 하단 근처에 설치돼요.
제품 리뷰 위젯은 리뷰 요약 위젯과 리뷰 목록 위젯을 결합한 위젯이에요. 사이트에 제품 리뷰 위젯을 추가하면 리뷰 목록 위젯과 리뷰 요약 위젯을 따로 추가할 필요가 없어요.
리뷰 목록 위젯은 게시된 모든 리뷰와 고객 질문 목록을 검색창, 필터, 리뷰 작성 버튼, 질문하기 버튼과 함께 표시해요. 일반적으로 리뷰 요약 위젯 바로 아래에 설치돼요.
추천 리뷰 캐러셀 위젯은 모든 제품에서 강조 표시된 리뷰를 보여줘요. 홈페이지, 독립형 리뷰 페이지 또는 사이트의 다른 어디에든 추천으로 표시할 수 있어요. 이 위젯에서 추천으로 표시할 리뷰를 선택할 수 있어요. 가능한 경우 고객이 제출한 이미지가 각 리뷰에 함께 표시되며, 리뷰와 함께 이미지가 제출되지 않은 경우 제품 이미지가 사용돼요.
SEO/모든 리뷰 위젯은 모든 제품의 모든 리뷰를 단일 페이지에 표시해요. 이 위젯을 사용하면 SEO를 개선하고, 잠재 고객이 현재 고객이 무엇을 좋아하는지 한곳에서 확인할 수 있어요. 이 위젯은 사이트의 독립형 리뷰 페이지에 가장 많이 추가돼요.

별점 위젯

별점 위젯을 사용해 제품의 평균 평점과 받은 리뷰 수를 눈에 띄게 표시해 보세요.

제품 제목 아래에 이 위젯을 설치하려면:

Shopify 스토어 관리자 페이지를 여세요.
판매 채널에서 온라인 스토어를 클릭하세요.
현재 테마 옆의 점 3개 메뉴를 클릭한 다음 복제를 선택해 현재 테마의 복제본을 만드세요.
점 3개 메뉴에서 코드 편집을 클릭하세요.

파일 검색창에 “product”를 검색하고 제품 페이지 콘텐츠에 사용된 파일을 찾으세요. product.liquid일 수도 있고, product-template.liquid, 또는 이와 유사한 파일일 수도 있어요. (맞춤 제품 페이지 템플릿을 사용하는 경우 대신 그 템플릿을 선택하세요.)

파일을 선택한 다음 {{ product.title }}을(를) 검색해 제품 제목을 표시하는 코드를 찾으세요.

이 코드 아래에 새 줄을 추가해 주세요.
새 줄에 이 코드 조각을 붙여넣으세요:
<div class="klaviyo-star-rating-widget" data-id="{{product.id}}" data-product-title="{{product.title}}" data-product-type="{{product.type}}"></div>

저장을 클릭합니다.
스토어 미리보기를 클릭하세요.
스토어 미리보기 내의 제품 페이지로 이동합니다. 제품 제목 아래에 별 위젯이 표시됩니다.

제품 리뷰 위젯

리뷰 요약 및 리뷰 목록 위젯(또는 제품 리뷰 위젯만)을 사용해 사이트의 각 제품에 대해 게시된 모든 리뷰의 요약과 목록을 추가하세요.

요약 위젯과 리스트 위젯을 별도로 설치하려면 아래의 별도의 리뷰 요약 및 리뷰 리스트 위젯 섹션으로 이동하세요.

이 위젯을 설치하려면:

Shopify 스토어 관리자 페이지를 여세요.
판매 채널에서 온라인 스토어를 클릭하세요.
현재 테마 옆의 맞춤 설정을 클릭해 편집하거나, 라이브 테마가 아닌 초안 테마를 편집하려면 점 3개 메뉴 > 복제를 클릭하세요.
점 3개 메뉴에서 코드 편집을 클릭하세요.

파일 검색창에 “product”를 검색하고 제품 페이지 콘텐츠에 사용된 파일을 찾으세요. product.liquid일 수도 있고, product-template.liquid, 또는 이와 유사한 파일일 수도 있어요. (맞춤 제품 페이지 템플릿을 사용하는 경우 대신 그 템플릿을 선택하세요.)