카페 24

카페 24

※ 카페 24를 사용하시는 고객님을 위한 스크립트 설치 가이드입니다.

개요

---

• 그루비 서치를 이용하기 위해 쇼핑몰 데스크탑(PC), 모바일(Mobile) 페이지에 스크립트 설치가 필요합니다. 이는 구글 애널리틱스 추적 코드 설치와 동일한 방식입니다.

• 임대형 쇼핑몰의 경우, 일반적으로 디자인 편집 기능을 제공하므로 디자인 편집 영역에 스크립트를 추가합니다.

• 스크립트 설치는 PC와 Mobile각각 1. 공통 스크립트, 2. 상품 상세 스크립트, 3. 주문서 스크립트 설치가 필요합니다.

💻 PC

1. 공통 스크립트 설치 (PC)

---

◾ 그루비 서비스키 복사

1. 그루비 어드민 로그인 > 설정 클릭

2. 서비스키 드래그 하여 복사 ㅤ

◾ 공통 스크립트 설치 위치 ㅤ

아래 공통 스크립트 내용 중 '발급 받은 서비스키' 부분을 복사한 서비스키로 대체한 뒤 안내에 따라 정확한 위치에 붙여넣으세요.

공통 스크립트

<script type="text/javascript">
    (function(a,i,u,e,o) {
        a[u]=a[u]||function(){(a[u].q=a[u].q||[]).push(arguments)};
    })(window, document, "groobee");
    groobee("serviceKey", "발급 받은 서비스키");
    groobee("siteType", "cafe24"); 
</script>
<script charset="utf-8" src="//static.groobee.io/dist/g2/groobee.init.min.js"></script>

'발급 받은 서비스키'부분을 반드시 서비스키로 대체해주셔야 합니다.

1. 카페24 관리자 페이지 로그인 후 관리자 모드 '프로모드' 선택

1. '상점관리' 클릭

2. '운영관리' 클릭

3. '검색엔진최적화(SEO)' 클릭

4. '고급 설정' 클릭

5. Head 태그 소스 안에 공통 스크립트를 삽입하세요 (발급받은 서비스키가 포함되어 있어야 합니다)

6. 화면 하단에 위치한 '저장' 버튼을 클릭하여 설정한 내용을 저장합니다.

2. 상품 상세 스크립트 설치 (PC)

---

◾ㅤ스크립트 설치 경로

1. '디자인 관리' 클릭

2. '디자인 수정하기' 클릭

◾ㅤ스마트디자인 편집창에서 안내에 따라 스크립트 설치

---

상품 상세 스크립트

<div class="groobeeProductDetail" style="display: none;">
    <span class="groobeeProductName">{$name}</span>
    <span class="groobeeProductPrice">{$product_price}</span>
    <span class="groobeeProductSalePrice">{$product_sale_price}</span>
    <span class="groobeeProductCode">{$product_no}</span>
    <span class="groobeeProductImage">{$medium_img}</span>
    <span class="groobeeProductCategory"></span>
    <span class="groobeeProductCategoryName"></span>
    <span class="groobeeProductStatus">{$soldout_icon}</span>
</div>

1. '상품' 클릭

2. '상품상세' 클릭

3. <div module="product_detail"> 하단에 '상품 상세 스크립트' 삽입

4. 저장ㅤ

3. 주문서 스크립트 설치 (PC)

---

주문서 스크립트

<div class="groobeeOrderList" module="Order_normallist" style="display: none;">
    <a class="groobeeProductA" href="/product/detail.html{$param}"></a>
    <span class="groobeeProductName">{$product_name_link}</span>
    <span class="groobeeProductAmount">{$product_total_price_front}</span>
    <span class="groobeeProductPrice">{$product_price_front}</span>
    <span class="groobeeProductSalePrice">{$product_sale_price_front}</span>
    <span class="groobeeProductCount">{$product_quantity_text}</span>
    <span class="groobeeProductImage">{$product_image}</span>
</div>

<div class="groobeeOrderList" module="Order_supplierlist" style="display: none;">
    <a class="groobeeProductA" href="/product/detail.html{$param}"></a>
    <span class="groobeeProductName">{$product_name_link}</span>
    <span class="groobeeProductAmount">{$product_total_price_front}</span>
    <span class="groobeeProductPrice">{$product_price_front}</span>
    <span class="groobeeProductSalePrice">{$product_sale_price_front}</span>
    <span class="groobeeProductCount">{$product_quantity_text}</span>
    <span class="groobeeProductImage">{$product_image}</span>
</div>

<div class="groobeeOrderList" module="Order_individuallist" style="display: none;">
    <a class="groobeeProductA" href="/product/detail.html{$param}"></a>
    <span class="groobeeProductName">{$product_name_link}</span>
    <span class="groobeeProductAmount">{$product_total_price_front}</span>
    <span class="groobeeProductPrice">{$product_price_front}</span>
    <span class="groobeeProductSalePrice">{$product_sale_price_front}</span>
    <span class="groobeeProductCount">{$product_quantity_text}</span>
    <span class="groobeeProductImage">{$product_image}</span>
</div>

해외배송을 사용하는 사이트의 경우 아래 스크립트를 추가로 삽입해 주세요.

<div class="groobeeOrderList" module="Order_oversealist" style="display: none;">
    <a class="groobeeProductA" href="/product/detail.html{$param}"></a>
    <span class="groobeeProductName">{$product_name_link}</span>
    <span class="groobeeProductAmount">{$product_total_price_front}</span>
    <span class="groobeeProductPrice">{$product_price_front}</span>
    <span class="groobeeProductSalePrice">{$product_sale_price_front}</span>
    <span class="groobeeProductCount">{$product_quantity_text}</span>
    <span class="groobeeProductImage">{$product_image}</span>
</div>

'주문' > '주문서작성'을 선택한 후 <div module="Order_form">를 찾아 바로 하단에 아래 주문서 스크립트를 복사하여 삽입하세요.

1. '주문' 클릭

2. '주문서작성' 클릭

3. <div module="Order_form" ~>바로 하단에 아래 주문서 스크립트를 복사하여 삽입

📱 Mobile

1. 공통 스크립트 설치 (Mobile)

---

◾ 그루비 서비스키 복사

1. 그루비 어드민 로그인 > 설정 클릭

2. 서비스키 드래그 하여 복사 ㅤ

◾ 공통 스크립트 설치 위치

아래 공통 스크립트 내용 중 '발급 받은 서비스키' 를 복사한 서비스키로 대체한 뒤 안내에 따라 정확한 위치에 붙여넣으세요.

공통 스크립트

<script type="text/javascript">
    (function(a,i,u,e,o) {
        a[u]=a[u]||function(){(a[u].q=a[u].q||[]).push(arguments)};
    })(window, document, "groobee");
    groobee("serviceKey", "발급 받은 서비스키");
    groobee("siteType", "cafe24_m");
</script>
<script charset="utf-8" src="//static.groobee.io/dist/g2/groobee.init.min.js"></script>

'발급 받은 서비스키'부분을 반드시 서비스키로 대체해주셔야 합니다.

1. '상점관리' 클릭

2. '운영관리' 클릭

3. '검색엔진최적화(SEO)' 클릭

4. '고급 설정' 클릭

5. '모바일 쇼핑몰' 클릭

6. Head 태그 소스 안에 공통 스크립트를 삽입하세요 (발급받은 서비스키가 포함되어 있어야 합니다)

7. 화면 하단에 위치한 '저장' 버튼을 클릭하여 설정한 내용을 저장합니다.

2. 상품 상세 스크립트 설치 (Mobile)

---

◾ㅤ스크립트 설치 경로

1. '모바일쇼핑몰' 클릭

2. '디자인 수정하기' 클릭ㅤ

◾ㅤ스마트디자인 편집창에서 안내에 따라 스크립트 설치

상품 상세 스크립트

<div class="groobeeProductDetail" style="display: none;">
    <span class="groobeeProductName">{$name}</span>
    <span class="groobeeProductPrice">{$product_price}</span>
    <span class="groobeeProductSalePrice">{$txt_product_price_mobile}</span>
    <span class="groobeeProductCode">{$product_no}</span>
    <span class="groobeeProductImage">{$medium_img}</span>
    <span class="groobeeProductCategory"></span>
    <span class="groobeeProductCategoryName"></span>
    <span class="groobeeProductStatus">{$soldout_icon}</span>
</div>

1. '상품' 클릭

2. '상품상세' 클릭

3. <div module="product_detail"> 하단에 '상품 상세 스크립트' 삽입

4. 저장

ㅤ

3. 주문서 스크립트 설치(Mobile)

---

주문서 스크립트

<div class="groobeeOrderList" module="Order_normallist" style="display: none;">
    <a class="groobeeProductA" href="/product/detail.html{$param}"></a>
    <span class="groobeeProductName">{$product_name_link}</span>
    <span class="groobeeProductAmount">{$product_total_price_front}</span>
    <span class="groobeeProductPrice">{$product_price_front}</span>
    <span class="groobeeProductSalePrice">{$product_sale_price_front}</span>
    <span class="groobeeProductCount">{$product_quantity_text}</span>
    <span class="groobeeProductImage">{$product_image}</span>
</div>

<div class="groobeeOrderList" module="Order_supplierlist" style="display: none;">
    <a class="groobeeProductA" href="/product/detail.html{$param}"></a>
    <span class="groobeeProductName">{$product_name_link}</span>
    <span class="groobeeProductAmount">{$product_total_price_front}</span>
    <span class="groobeeProductPrice">{$product_price_front}</span>
    <span class="groobeeProductSalePrice">{$product_sale_price_front}</span>
    <span class="groobeeProductCount">{$product_quantity_text}</span>
    <span class="groobeeProductImage">{$product_image}</span>
</div>

<div class="groobeeOrderList" module="Order_individuallist" style="display: none;">
    <a class="groobeeProductA" href="/product/detail.html{$param}"></a>
    <span class="groobeeProductName">{$product_name_link}</span>
    <span class="groobeeProductAmount">{$product_total_price_front}</span>
    <span class="groobeeProductPrice">{$product_price_front}</span>
    <span class="groobeeProductSalePrice">{$product_sale_price_front}</span>
    <span class="groobeeProductCount">{$product_quantity_text}</span>
    <span class="groobeeProductImage">{$product_image}</span>
</div>

해외배송을 사용하는 사이트의 경우 아래 스크립트를 추가로 삽입해 주세요.

<div class="groobeeOrderList" module="Order_oversealist" style="display: none;">
    <a class="groobeeProductA" href="/product/detail.html{$param}"></a>
    <span class="groobeeProductName">{$product_name_link}</span>
    <span class="groobeeProductAmount">{$product_total_price_front}</span>
    <span class="groobeeProductPrice">{$product_price_front}</span>
    <span class="groobeeProductSalePrice">{$product_sale_price_front}</span>
    <span class="groobeeProductCount">{$product_quantity_text}</span>
    <span class="groobeeProductImage">{$product_image}</span>
</div>

'주문' > '주문서작성'을 선택한 후 <div module="Order_form">를 찾아 바로 하단에 아래 주문서 스크립트를 복사하여 삽입하세요.

1. '주문' 클릭

2. '주문서작성' 클릭

3. <div module="Order_form" ~>바로 하단에 아래 주문서 스크립트를 복사하여 삽입

🔎 스크립트 설치 확인

---

1. 모든 스크립트를 설치하셨다면, 쇼핑몰에 접속하여 스크립트가 정상적으로 설치가 됐는지 확인하실 수 있습니다.

1. 그루비 어드민 > 대시보드 화면으로 이동한 후 방문 수 데이터를 확인합니다. 스크립트가 정상적으로 적용되었다면 방문 수가 1이상으로 표시됩니다.

스크립트 설치를 완료하였음에도 방문 수 데이터가 증가하지 않는다면 스크립트가 제대로 설치되지 않은 것일 수 있습니다. 그루비 홈페이지와 어드민 화면 우측 하단에 '문의하기' 통해 문의 바랍니다.

👉 그루비 홈페이지

👉 그루비 어드민 페이지

그루비 서치 서비스 시작

---

스크립트 설치가 정상적으로 완료되었다면 추천 상품 선별을 위한 데이터 수집이 시작됩니다.

(데이터 수집 기간은 사이트 트래픽에 따라 다르며 일반적으로 하루 이상 소요됩니다.)

데이터 수집이 완료되면 추천 상품 영역을 설정한 후 그루비 서치를 시작할 수 있습니다.

쇼핑몰에 추천 상품 영역을 설정하고 적용하는 방법은 아래 콘텐츠를 확인해 주세요!

새로운 추천 만들기