予約販売App

入荷前の商品を先行発売し、予約注文を受けることができるAppです。

予約販売App利用時の商品のステータスについて

予約販売Appでは、発送予定日を設定することができます。 商品のステータス詳細に関しては商品ステータスをご覧ください。

また、通常販売と予約販売中の商品を同時にカートに入れることはできません。(全体公開時)

予約販売設定された商品のステータスを表す変数

タグ	説明
{block:ItemPreOrder}	商品のステータスが 予約販売中 の時（設定されてない通常の商品も対象）

変数

各タグの詳細、利用方法は以下の「対応が必要なページ」をご覧ください。

対応が必要な箇所

• トップページ商品一覧(任意)
• 商品ページ（商品のステータス）
• 商品ページ（購入ボタンの制御）

トップページ商品一覧(任意)

商品一覧の表示で、予約販売設定済みの商品の状態に応じてステータスを表す文言を入れてください。

実装例1

{ItemPreOrderTag} を利用し、 予約販売設定された商品の状態に応じて自動的に予約商品テキストを表示できます。

（予約期間中の商品を予約商品、在庫切れの場合SOLD OUT）

商品ページ（商品のステータス）

商品一覧と同様の方法で、予約商品の状態に応じて 予約商品 や SOLD OUT の表示をしてください。

発送予定日の情報

発送予定日: xxxx年xx月xx日 の部分は、従来の ItemAttentionTag で自動的に表示されます。

下記のHTMLが展開されますのでテーマのデザインに応じてスタイルを適応してください。

予約販売中の場合
<div class="preOrder">
    <div class="preOrder__label">予約商品</div>
    <p><span class="preOrder__data">発送予定: 20xx年x月x日~20xx年x月x日</span></p>
</div>

購入ボタンの制御に関する変数

予約商品の場合、購入ボタンテキストが予約注文すると表示されます。 購入ボタンの詳しい説明は購入ボタンの制御をご覧ください。

テストパターン

テーマ申請の際に下記のテストパターンを確認してください。

• 予約期間中の表示
  • 商品一覧ページ(任意)
    • 予約商品表示されている
  • 商品詳細ページ
    • 予約商品ラベルが表示されている
    • 発送開始・終了予定日が表示されている
    • カートボタンテキストが予約注文と表示されている
    • 在庫がない場合は購入できず、SOLD OUT表示されている
    • 予約商品の設定をリセットし、通常商品に切り替わった際にカートボタンテキストが'カートに入れる'と表示されている
• 英語・外貨対応Appと併用するときの英語表示
  • 予約商品の表記がPre-OrderItemと表示されている
  • 発送予定がScheduled shipping date: mm/dd/yyyy
  • 購入ボタンがPre-Orderと表示されている
• 販売期間Appと併用するときの表示
  • 販売前の場合にはComingSoonと表示されている
  • 販売終了の場合には購入できず、SOLD OUT表示されている。