Skip to main content
Subscription upgrade 블록은 Cart items 안에 중첩되는 하위 블록이에요. 쇼핑객이 자격이 있는 일회성 라인 아이템을 카트에서 바로 구독으로 전환하도록 유도하여 결정의 순간에 일회성 구매를 반복 수익으로 바꾸고, 이미 구독 중인 쇼핑객은 해당 라인에서 플랜을 변경하거나 취소할 수 있게 해요.

동작

  • 자격이 있는 라인에만 나타나요. 블록은 상품의 판매 플랜을 읽고, 구독 플랜이 없는 상품의 라인에는 아무것도 렌더링하지 않아요.
  • 리워드 사은품에는 절대 표시되지 않아요. 자동으로 지급된 무료 사은품을 구독하면 리워드 상태가 사라지므로, 해당 라인에서는 프롬프트가 표시되지 않아요.
  • 일회성 라인에는 업그레이드 CTA(행동 유도 문구)를 표시해요.
  • 이미 구독 중인 라인에는 플랜 선택기와 “일회성으로 다운그레이드” 옵션을 표시해요.

설정

배치 및 제한

  • 부모: Cart items 안에만 중첩돼요.
  • 최대: 카트당 1개.
  • 기본으로 추가되지 않아요. 잠겨 있지 않아 제거하거나 숨길 수 있어요.
하위 블록이므로 라인마다 렌더링되며, Product row를 기준으로 어디에 배치하는지에 따라 상품 콘텐츠 위 또는 아래에 위치해요. 하위 블록 위치 지정 방식을 참고하세요.

커스텀 템플릿

Code 탭에서 커스텀 템플릿을 지원하며, 이 블록의 기본 마크업을 여러분의 JSX로 대체해요. 다음은 블록이 받는 props예요. 이 블록은 두 가지 상태 중 하나를 렌더링하며, view.state가 어느 쪽인지 알려줘요. 커스텀 템플릿 안에서 view는 절대 null이 아니에요: 라인에 플랜이 없으면 블록은 아무것도 렌더링하지 않고 템플릿도 호출되지 않아요. view.plans의 각 항목은 { id: number, name: string, discountPercent: number }예요.
<select>에는 onChange를, 버튼에는 selectPlan을 사용하세요. onChange는 이미 oneTimeValue 센티널을 처리해요; <select>에 직접 핸들러를 연결한다면 oneTimeValue와 비교해서 직접 selectPlan(null)을 호출해야 해요.

디자인

설정 패널의 Design 섹션에서 이 블록의 스타일을 지정하세요. 이는 전역 디자인 위에 적용되는 블록별 오버라이드이며, 비워 두면 전역 디자인으로 폴백돼요. 디자인 설정이 무엇인가요? 여기서 자세히 알아보세요: 디자인 설정.