定期購入ウィジェット

Shopifyの商品ページにChargezenの定期購入ウィジェットを追加し、テンプレートを選び、文言とデザインを設定して、カートに追加する前のオファーを加えます。

最終更新日:2026-10-18

定期購入ウィジェットは商品ページの購入ボックスで、購入者はここで1回限りの購入か定期購入かを選び、お届け頻度を選んでカートに追加します。ほとんどの定期購入はここから始まるので、わかりやすくする価値があります。Subscriptions → Customer experience → Subscription widgetを開きます。

設定する

1

ウィジェットを作成する

Create widgetを選び、Product widget(どの商品ページにも使えるコンパクトな購入ボックス)またはVariant cards(バリエーションのカード、1回限りの購入か定期購入の選択、カートに追加する前のオファー)でUse templateを選びます。

2

文言とデザインを編集する

編集画面のセクション(Content、Layout、Behavior、Styleなど)を順に設定します。Previewingで商品を選び、デスクトップとモバイルのボタンで両方のサイズを確認します。

3

表示する場所を選ぶ

PublishでWidget name(ストア側だけが見る名前)を入力し、Show onをAll productsまたはSpecific productsに設定します。

4

保存する

Saveを選びます。

5

テーマにブロックを追加する

On your storeでAdd the block in Shopifyを選びます。ShopifyでOnline Store → Themes → Customizeを開き、商品テンプレートを開いてChargezen product widgetまたはChargezen variant cardsのブロックを追加し、テーマを保存します。

プランから始める

プランのStorefront widgetカードでCustomize widgetを選ぶと、そのプランの商品のウィジェットが開くか、新しいウィジェットの作成が始まります。

Product widgetのオプション

  • Content:ボタンの文言(Add to cart、Buy now)、1回限りの購入の選択肢のタイトルとサブタイトル、定期購入の選択肢のタイトル、サブタイトル、Delivery selector label、数量のラベル。初期値は「One-time purchase」「Subscribe and save」「Pause, skip, or cancel anytime.」です。
  • Layout:販売元、商品名、価格、バリエーションの選択、1回限りの購入と定期購入の選択肢、お届け頻度の選択、数量の選択、Add to cart、Buy nowの表示・非表示。
  • Behavior:Selected by default(Auto、One-time、Subscription)、Shown first、数量の上限、ウィジェットにバリエーションの画像を表示するか、テーマの商品画像を切り替えるか。
  • Rules:確認のポップアップ付きのAllow preorders、警告メッセージ付きのConfirm before purchase、ラベルと割引率を設定するDiscount this product、Offer all variants as a bundle。
  • Style:ボタンの色と文字、文字の色、選択時の色、背景と枠線。

Variant cardsのオプション

  • Content:1回限りの購入と定期購入のカード、ボタンの文言、売り切れの表示、通貨記号。定期購入のタイトルでは、{{savings}}が割引額に置き換わります。
  • Layout:価格、バリエーションのカードと列数、表示するカードとボタン。
  • Offers:Bundle (try them all)、Upsell、Buy more、Sell as another variant、Preorderを追加します。それぞれにShow this offerがあり、必須項目を入力するまではオフのままです。アップセルが断られたときは、別のオファーを出すか、何も出さないかを選べます。
  • Variants:カードを価格の安い順、高い順、または任意の順に並べます。バリエーションの名前の変更、非表示、売り切れ表示ができます。
  • Behavior:Selected by default。Autoは、/startと/payのリンクでは定期購入を、それ以外では1回限りの購入を選びます。
  • StyleとCustom CSS:色、角の丸み、文字のスタイル、ウィジェット自体のスタイルのあとに読み込まれるCSS(セレクターは#ketonaid-widgetから始めます)。

商品に使われるウィジェット

All productsに設定したウィジェットは、専用のウィジェットがある商品を除くすべての商品に表示されます。特定の商品向けのウィジェットが複数あり、同じ商品を含む場合は、Priorityが高いほうが使われます。

ウィジェットの一覧には、各ウィジェットのType、Template、Status、Scope、Offersが表示されます。FilterでAll、Active、Draftのウィジェットを表示し、行のメニューでEditやDeleteを行います。

トラブルシューティング

商品ページにウィジェットが表示されない

  • 使っている商品テンプレートにブロックが追加されていること、テーマを保存したことを確認してください。
  • ウィジェットがその商品、またはAll productsに表示する設定になっていることを確認してください。
  • その商品を含む別のウィジェットの優先度が高くなっていないか確認してください。

ウィジェットは表示されるが、定期購入の選択肢が表示されない

  • プランがActiveで、その商品を含み、Online Storeチャネルがオンになっている必要があります。Online Storeに表示しないプランは、どのウィジェットにも表示されません。
  • 購入者が商品ページから定期購入できるように、プランに商品を追加してください。

ウィジェットを保存できない

ウィジェットに名前を付け、商品を1つ以上選ぶか、すべての商品に表示する設定にしてください。

このページは役に立ちましたか?

さらにサポートが必要ですか? サポートに問い合わせる