자체 사이트에서 온라인 주문

“온라인 주문” 위젯은 이미 보유한 사이트에 주문 접수를 추가합니다. 옮기거나 다시 퍼블리싱할 필요가 없습니다. 위젯이 사이트 페이지를 읽고 “장바구니에 담기” 버튼을 배치하며, 기존 레이아웃 위에서 장바구니와 주문서를 운영합니다.

위치: 마케팅 → “내 사이트” → “온라인 주문” 카드 → 톱니바퀴. 설치 코드는 모든 위젯에 공통이며, 내 사이트를 참조하십시오.

네 가지 작동 모드#

모드	방문자가 보는 것	선택 시점
자체 상점	“주문하기” 버튼, 클릭 시 페이지 위에 메뉴와 장바구니가 있는 상점이 열림	명함형 사이트, 방문 페이지, 블로그 — 페이지에 상품이 없음
사이트 위에 표시	기존 레이아웃에 직접 배치된 “장바구니에 담기” 버튼 — 상품 페이지와 카탈로그에, 화면 모서리에 장바구니	사이트에 상품 카탈로그가 이미 있지만 주문 접수가 없거나 불편한 경우
버튼 교체	위와 동일하며 사이트의 기존 “구매” 버튼과 장바구니가 숨겨짐	모든 주문을 자체 시스템으로만 받고 싶은 경우
완전 가로채기	사이트는 그대로 보이며 버튼도 기존 것을 유지하지만, 누르면 상품이 자체 장바구니로 이동하고 사이트 장바구니로 가면 자체 장바구니가 열리며 카운터와 금액은 자체 수치를 표시	상점이 이미 잘 퍼블리싱되어 외관은 바꾸고 싶지 않지만 주문과 가격은 자체 시스템으로 관리해야 하는 경우

사이트 스캔#

“자체 상점”을 제외한 모든 모드는 사이트 맵을 기반으로 작동합니다. 즉, 페이지에서 상품명, 가격, 이미지, 기존 구매 버튼, 기존 장바구니가 어디에 있는지를 파악합니다.

맵은 스캐너가 구축합니다. 주소를 입력하고 “사이트 스캔”을 누르면 보통 1–3분이 걸립니다. 내부 과정:

플랫폼 프리셋 — 8개 플랫폼용 선택자 세트가 준비되어 있습니다: WooCommerce, Shopify, Magento, PrestaShop, Bitrix, InSales, Tilda, OpenCart. 스캐너는 지문으로 Ecwid, Squarespace, Wix도 인식하지만 이들용 프리셋은 없으며 맵은 AI 분석으로 구축됩니다.
레이아웃 AI 분석 — 직접 제작한 사이트와 비표준 테마용.
검증 — 발견된 각 선택자를 실제 페이지에서 확인하며 데이터는 상품 마이크로데이터와 대조됩니다. 검증되지 않은 선택자는 맵에 포함되지 않습니다. 버튼이 잘못된 위치에 있는 것보다 버튼 수가 적은 편이 낫습니다.

결과적으로 확인된 플랫폼, 스캔한 페이지 수, 인식된 상품 예시, 그리고 상품 페이지와 카탈로그 카드를 구분하여 볼 수 있습니다. 맵은 버튼으로 적용되며 위젯 설정과 함께 저장됩니다. 사이트가 변경되면 다시 스캔하면 됩니다.

버튼 배치 및 디자인#

실시간 미리보기가 있는 목업에서 설정합니다. 일반적인 상품 페이지와 카탈로그:

상품 페이지 버튼: 가격 아래, 사이트의 기존 버튼 옆, 화면 하단에 떠 있는 형태 또는 비활성화(“완전 가로채기”의 주요 시나리오 — 자체 버튼이 없고 방문자가 기존 버튼을 누름)
카탈로그 카드 버튼: 카드 위, 카드 아래 또는 비활성화
장바구니 버튼: 화면 네 모서리 중 하나
버튼 색상과 텍스트(“장바구니에 담기”, “주문하기”, 직접 입력) — 문구는 사이트의 각 언어별로 따로 지정할 수 있습니다.

자체 가격#

별도 토글: 위젯이 사이트 가격을 자체 가격으로 재계산하여 상품 페이지, 카탈로그, 장바구니에서 방문자에게 표시합니다.

모든 상품에 대한 기본 규칙: 퍼센트, 통화 단위 추가 금액, “이하/이상” 제한, 반올림(정수로, 끝자리 …9, 소수점 .99, 10단위 …0, 10/50/100의 배수).
페이지 주소, 이름 또는 품번별 개별 재정의: 자체 가격, 자체 규칙, 장바구니에서 다른 이름 또는 “판매 중지” — 이 경우 버튼이 배치되지 않습니다.
표시 옵션: 새 가격 옆에 취소선으로 표시되는 기존 가격, “할인가” 같은 문구, 자체 통화 문구, 추가 가격 위치(고정 패널, “유사 상품” 블록). 사이트 마크업에서 직접 가격을 다시 그리는 기능은 끌 수도 있습니다. 방문자는 사이트 가격을 보고 장바구니에는 자체 가격이 담깁니다.
계정에 사이트의 샘플 가격으로 “변경 전 → 변경 후” 미리보기가 있습니다.

⚠️ 재작성은 시각적입니다. 사이트 백엔드는 새 가격을 알지 못합니다. 따라서 자체 가격은 주문 가로채기와 함께 사용해야 의미가 있습니다. 그렇지 않으면 남아 있는 기존 버튼을 누른 방문자가 자체 시스템을 거치지 않고 기존 가격으로 주문하게 됩니다. “완전 가로채기” 모드에서는 자체 가격이 기본으로 켜져 있으며, 가로채기 없이 켠 경우 관리자 페이지에서 경고합니다.

주문 후 진행되는 일#

방문자가 상품을 장바구니에 담고 장바구니를 열어 주문합니다 — 이름, 전화번호, 배송 또는 주소가 있는 픽업, 코멘트. 주문은 상점, POS, 어그리게이터의 주문과 마찬가지로 계정의 “주문” 섹션에 들어옵니다. 동일한 상태, 알림, 인쇄, 주방 전달이 적용됩니다. 별도의 “위젯 인박스”는 없습니다. 각 주문 행에는 장바구니에 담긴 해당 사이트 페이지 링크가 함께 제공되어 운영자가 무엇을 주문했는지 확인할 수 있습니다.

온라인 주문에 관한 나머지 설정은 위젯 모달에서 동일하게 구성됩니다. “사이트의 위젯”, “주문 접수”, “배송 및 픽업”, “결제”, “주문서”, “영수증 재정화” 섹션이 있는 아코디언 형태로 되어 있으며, 계정의 해당 섹션과 동일한 양식이 한곳에 모여 있습니다.

“재입고 알림” 버튼#

같은 위젯의 두 번째, 별도 태그로, 사이트에서 품절된 상품 페이지용입니다. 고객이 버튼을 누르고 이메일을 남기고 메일의 링크로 확인하면, 상품이 재입고되었을 때 한 통의 메일을 받습니다. 확인 메일에는 “확인” 옆에 “거부”도 있습니다. 알림은 우리 상점의 “재입고 알림” 구독과 같은 메커니즘으로 발송되며, 별도의 구독이 생기지는 않습니다.

연결 방법: 온라인 주문 설정 창에서 “🔔 재입고 알림” 카드를 열고 상품을 선택한 뒤, 공개된 카탈로그에 있다면 옵션을 선택하면 생성기가 코드를 만들어 줍니다. 상품 페이지에 data-cenaly-stock="<상품>" 속성이 있는 버튼을 배치하고(완성된 예시는 같은 카드에 있습니다) stock/v1.js 태그를 한 번 삽입합니다. 로더는 1킬로바이트 미만이며 정확히 한 가지 일만 합니다 — 클릭을 기다리는 것입니다. 구독 양식, 사전, 발송은 고객의 행동 이후 별도 파일로 로드됩니다.

알아두어야 할 점:

상품은 수동으로 연결됩니다. 다른 카탈로그를 대조하지 않고 다른 페이지의 재고를 읽지 않습니다. “재입고”란 우리 쪽의 귀하 카탈로그에 있는 재고, 즉 우리 상점이 보는 것과 같습니다. 게시된 지점 카탈로그에 없는 상품은 버튼이 받지 않습니다.
구독은 이메일로 확인됩니다(double opt-in): 메일의 링크를 클릭하기 전까지는 재입고 메일이 발송되지 않습니다.
구독은 상품을 예약하지 않습니다. 알림은 우리 카탈로그에 재입고될 때 발송됩니다. 현재 버전에서는 하나의 이메일이 상품당 한 번만 집계됩니다: 같은 상품의 다른 옵션에 다시 구독해도 이미 선택한 옵션이 대체되지 않습니다.
엄격한 CSP에서는 nonce가 있는 경우에만 구독 양식이 CDN 스크립트에 대한 추가 허용이나 적절한 'strict-dynamic' 정책 없이는 아직 열리지 않습니다: 자세한 내용은 “내 사이트”를 참조하십시오.
이것은 단일 태그가 아닙니다. “재입고 알림” 버튼은 “내 사이트”의 단일 로더가 불러오지 않습니다 — 자체 태그와 페이지의 자체 마크업이 있습니다. 설치한 곳에서만 작동하기 때문입니다.

제한 사항#

스캐너는 서버 HTML을 읽습니다. 카탈로그가 전부 JavaScript로 그려지면 상품 페이지를 찾지 못할 수 있습니다 — 이 경우 “자체 상점” 모드가 작동합니다.
장바구니의 상품은 귀하 사이트의 페이지에서 가져오며, 계정의 카탈로그에서 가져오지 않습니다: 이름과 가격을 위젯이 페이지 자체에서 읽습니다(필요한 경우 귀하의 가격 규칙에 따라 다시 계산합니다). 이를 위해 카탈로그를 우리 쪽으로 옮길 필요는 없습니다 — 하지만 계정의 재고는 이러한 주문을 차감하지 않습니다.
위젯의 장바구니에서 착불 결제 또는 지점에 지원되는 결제 제공업체가 설정된 경우 온라인 결제를 선택할 수 있습니다. 주문 생성 후 고객은 제공업체 페이지로 이동합니다. 위젯 자체는 카드 데이터를 받지 않습니다. 결제를 준비하지 못한 경우 이미 생성된 주문에 대해 다시 시도할 수 있습니다.
“버튼 교체” 모드에서는 기본 버튼이 시각적으로 숨겨집니다. 사이트에 다른 결제 경로(예: 다른 장바구니로의 직접 링크)가 있는 경우 직접 제거해야 합니다 — 또는 그러한 전환을 자체적으로 가져가는 “전체 가로채기” 모드로 전환해야 합니다.

문제 해결#

사이트에 “장바구니에 담기” 버튼이 없습니다.

태그를 찾을 수 없음 — “내 사이트” 섹션에서 “설치 확인”을 누르십시오. “코드 없음” — 태그가 삽입되지 않았거나 템플릿의 모든 페이지에 있지 않습니다. “다른 지점의 코드” — 태그에 다른 data-domain이 있습니다. 태그를 Google Tag Manager로 삽입한 경우 확인이 이를 보지 못하므로 사이트를 눈으로 확인하십시오.
변경 사항이 반영되지 않음 — 위젯 파일은 5분 캐시로 CDN을 통해 제공됩니다: 기다린 후 캐시를 지우고 페이지를 새로 고치십시오.
사이트맵이 생성되지 않았거나 적용되지 않음 — “자체 상점” 외의 모드에서는 사이트맵에 따라 버튼이 배치됩니다: 사이트를 스캔하고 결과를 적용하십시오.
스캐너가 상품 페이지를 찾지 못함 — 서버 HTML을 읽습니다. 카탈로그가 전부 JavaScript로 그려지면 “자체 상점” 모드로 전환하십시오.
상품 페이지의 버튼이 배치 설정에서 꺼져 있음 — 고객이 사이트의 기본 버튼을 누르는 “전체 가로채기” 시나리오에서는 이렇게 설계되어 있습니다.

장바구니 버튼이 사라졌습니다. 배치 설정에서 선택한 화면 모서리를 확인하십시오. 멀티버튼이 활성화되어 있고 그 팬에 “주문” 항목이 있으면 위젯의 자체 버튼이 의도적으로 꺼집니다.

버튼이 잘못된 위치에 있거나 사이트 업데이트 후 사라졌습니다. 마크업이 변경되었습니다 — “다시 스캔”을 누르십시오: 배치 설정은 유지됩니다.

페이지의 가격이 변경되지 않았습니다. 사이트 마크업에서 직접 가격을 다시 그리는 것을 설정으로 끌 수 있습니다 — 그러면 고객은 사이트 가격을 보고 장바구니에는 귀하의 가격이 담깁니다. 또한 가격 규칙이 활성화되어 있고 해당 상품에 대한 개별 재정의가 없는지 확인하십시오.

고객이 사이트에서 주문했지만 계정에 주문이 없습니다. 대부분의 경우 주문이 우리를 거치지 않고 — 남아 있는 기본 버튼이나 사이트 장바구니로의 직접 링크를 통해 — 전송되었습니다. 이는 “버튼 교체” 또는 “전체 가로채기” 모드로 해결됩니다.

주문의 가격이 다릅니다. 가격 재작성은 시각적입니다: 귀하 사이트의 백엔드는 이를 알지 못합니다. 자체 가격은 주문 가로채기와 함께만 활성화하는 것이 좋습니다 — 그렇지 않으면 일부 주문이 이전 가격으로 우리를 거치지 않고 처리됩니다.

자주 묻는 질문#

카탈로그를 귀사로 이전해야 하나요? 아니요. 위젯은 고객님 사이트 페이지에 있는 상품을 그대로 사용합니다. 이름과 가격을 그곳에서 읽어옵니다. 계정의 카탈로그는 재고 관리, 항목별 분석, 그리고 저희 상점이 필요할 때만 요구됩니다. 사이트 주소를 통한 가져오기 또는 파일로 이전할 수 있습니다. 자세한 내용은 AI 카탈로그 가져오기 및 인터넷 상점을 참조하십시오.

사이트가 변경되면 어떻게 되나요? "다시 스캔"을 누르면 지도가 업데이트되고 배치 설정은 유지됩니다.

위젯이 레이아웃을 깨뜨리나요? 버튼은 고객님 마크업에서 발견된 위치에 삽입되며, 디자인은 설정할 수 있습니다. 장바구니와 결제는 페이지 위에 열리므로 고객님의 레이아웃을 건드리지 않습니다.

자체 웹사이트 온라인 주문