Shopify予約オプションの設定｜標準機能とアプリの境界

Shopifyで予約オプションを設定するとき、最初に決めるのは「その項目をどこに置くか」です。結論から言うと、料金が変わるオプションは商品バリエーションか別商品、料金が変わらない選択項目はラインアイテムプロパティ、所要時間まで変わるオプションは予約メニューそのものを分ける。この3つに振り分けるだけで、標準機能で足りる範囲とアプリが要る範囲がそのまま決まります。

わたしは予約アプリ まるっと予約 を作っています。アプリを売る立場ではありますが、この記事でいちばん書きたいのは「意外と標準機能で足りる」という話です。アプリが必要になる線がどこに引かれているかは、Shopifyの公式ヘルプにはっきり書かれています。

この記事が扱うのは、予約枠に付ける追加項目の作り方だけです。予約ページの見た目を整える話は Shopify予約ページのカスタマイズ手順、来店予約そのものの立ち上げは Shopifyで来店予約・店舗予約を受け付ける方法、担当者の指名まわりは 複数スタッフの指名予約を管理する方法 に分けてあります。

予約オプションとは？

予約枠そのものに付ける追加項目のことです。料金が上がる有料オプション（延長・追加メニュー・指名料）と、料金は変わらないけれど事前に聞いておきたい選択項目（希望の担当者・アレルギーの有無・来店人数）の2種類があり、Shopify上での置き場所がまったく違います。同じ「オプション」という言葉でひとくくりにすると、設定で必ず詰まります。

Shopify予約のオプションは、どこに設定するのが正解？

判断の分かれ目は2つだけです。 料金が変わるか と 所要時間が変わるか 。この2つで置き場が決まります。

4つの置き場を表にすると、こうなります。

Shopifyの標準機能で予約オプションはどこまで設定できる？

ここが、この記事でいちばん確認しておきたいところです。「オプションを作るならアプリ」と言われがちですが、Shopifyの管理画面とテーマだけでできることは思ったより多く、逆に「絶対にアプリが要る」場所もはっきりしています。

管理画面だけでできること

商品バリエーションです。Shopifyのヘルプには、1つの商品に設定できるオプションは最大3つ、バリエーションは最大2,048件と書かれています。

出典：バリエーションの追加（Shopify ヘルプセンター）

同じヘルプページには、この上限を超えたい場合の逃げ道も書かれています。「2,048件を超えるバリエーションや3つを超えるオプションがある商品を作成するには、Shopify App Storeの外部アプリを使用するか、テーマコードをカスタマイズしてラインアイテムプロパティを抽出し、お客様からカスタム要件を取得します」。つまり公式の案内としても、選択軸が4つ以上に増えた時点でアプリかテーマ編集、という線が引かれています。

予約の現場で選択軸が4つを超えることは、実際にはあまりありません。「コース × 人数 × 平日/週末」でちょうど3つです。ここに収まっているうちは、アプリを足す必要はありません。

テーマ編集でできること

商品ページに自由記入欄やチェックボックスを足すのは、ラインアイテムプロパティの役目です。商品フォームの中に name="properties[項目名]" を持つ入力欄を置くと、その内容がカートと注文に付いて回ります。

{% form 'product' %}
  <label for="allergy">アレルギー・苦手な食材</label>
  <input type="text" id="allergy" name="properties[アレルギー]" />
  <input type="submit" value="カートに追加" />
{% endform %}

出典：product テンプレート（Shopify.dev）

商品単位ではなくカート全体への要望であれば、カートノート（name="note"）とカート属性（name="attributes[項目名]"）が使えます。こちらもテーマのカートセクションを編集して追加します。

出典：cart テンプレート（Shopify.dev）

アプリが必要になること

チェックアウト画面です。Shopifyの管理画面から編集できるのは、もともとあるフィールドを必須・任意・非表示に切り替えることだけで、ヘルプにも「すべてのチェックアウトフォームフィールドを編集できるわけではありません」と明記されています。さらに「国ごとにチェックアウトフィールドを変更するには、チェックアウトの情報、発送、および決済のページをカスタマイズするアプリが必要です。これらのアプリは、Shopify Plus プランのストアでのみご利用いただけます」と続きます。

出典：チェックアウトフォームオプションを編集する（Shopify ヘルプセンター）

もうひとつアプリが要るのが、選択によって予約枠の長さを変える処理です。バリエーションが持てるのは価格・在庫・SKU・重量などで、所要時間という項目はありません。枠の長さを管理しているのは予約アプリ側なので、ここだけは標準機能では埋められません。

有料オプションは商品バリエーションでどう作る？

価格が変わるオプションは、まずバリエーションで持たせられないかを考えます。同じ商品ページの中で選べるので、お客様が別ページへ飛ばされません。

1. 1

   選択軸を3つ以内に絞る

   「人数」「コース」「曜日区分」のように、料金が変わる軸だけをオプション名にします。料金が変わらないものをここに入れると、バリエーション数が無駄に増えます。
2. 2

   オプション値に価格差を書き込む

   お客様に見えるのはオプション値の文字列です。「2名（＋3,000円）」のように差額を入れておくと、選択画面だけで判断できます。
3. 3

   バリエーションごとに価格を入れる

   バリエーションを追加すると、価格・在庫・配送の設定は商品単位からバリエーション単位へ移ります。入れ忘れたバリエーションが0円で売れる事故が起きやすい場所です。
4. 4

   配送が必要な商品のチェックを外す

   サービスの予約に送料が乗ると、チェックアウトで住所入力を求められます。バリエーションごとに設定が分かれるので、全件ぶん確認します。
5. 5

   カートへの追加制限を見直す

   「2名券を数量2」で買われると4名分になります。設定 → チェックアウト → 詳細設定のカートへの追加制限で、1注文あたりの上限を決めます。

追加制限はバリエーション単位で効きます。ヘルプには「最大数量は、商品やカート全体ではなく、各商品のバリエーションに個別に適用されます」と書かれているので、赤・青・緑それぞれに上限が付くイメージです。人数券を複数バリエーションに分けている場合は、合計が定員を超えうる点に注意してください。

出典：カートごとに追加できる商品の最大数量に制限を設定する（Shopify ヘルプセンター）

バリエーションと別商品、どちらに置く？

どちらも「料金が変わる／枠は変わらない」オプションの置き場です。使い分けは、予約本体と一緒に選ばせたいかどうかで決めます。

指名料のように「予約1件につき必ず1つ」の性質を持つものはバリエーション、物販に近いものは別商品が扱いやすい、というのが実装側から見た印象です。

無料の選択項目は予約時にどう聞けばいい？

「希望の担当者」「アレルギーの有無」「来店人数の内訳」のように、料金は変わらないけれど当日までに知っておきたいことがあります。これをバリエーションで作ると、価格が同じ組み合わせが延々と増えていくだけです。ラインアイテムプロパティで聞きます。

1. 01

   聞く項目を決める

   「予約を成立させるために必要か」で線を引きます。当日でも間に合う質問は、予約確認メールに回します。
2. 02

   商品フォームに入力欄を足す

   テーマの商品セクションに、properties[項目名] を name に持つ input や select を追加します。フォームの外に置くと送信されません。
3. 03

   必須にするなら required を付ける

   HTMLの required 属性で、未入力のままカートに追加されるのを止められます。ここはテーマ側の責任範囲です。
4. 04

   社内メモはアンダースコアで隠す

   項目名の先頭に _ を付けると、お客様側の表示から外れます。担当者の割り当てメモなどに使えます。
5. 05

   テスト注文で保存先を確認する

   注文詳細のどこに出るか、CSVに含まれるか、当日スタッフが見られるかを実際の注文で確かめます。

出典：line_item（Shopify.dev Liquid objects）

集める項目は少ないほどよい、というのは運用上の理由だけではありません。アレルギーや健康状態は取り扱いに配慮が要る情報です。予約に必要な範囲を超えて集めない、集めたなら閲覧できる人を限る、という判断は必要になります。個人情報の取り扱いに不安がある場合は、最終的な判断を専門家に確認してください。

オプションで所要時間が変わるときはどうする？

ここがいちばん事故りやすい場所です。「延長30分 ＋2,000円」を別商品として売っても、予約枠は30分のままです。次の予約が重なります。

1. 1

   所要時間が変わるオプションを洗い出す

   延長、オフあり、ロングヘア料金、初回カウンセリング付き。料金表の中で、時間が動くものに印を付けます。
2. 2

   時間ごとに予約メニューを分ける

   「90分コース」「120分コース」を別メニューとして登録し、それぞれに所要時間と価格を持たせます。1つのメニューで時間を可変にすると、カレンダーの空き計算が崩れます。
3. 3

   片付け時間をバッファに入れる

   施術後の清掃や入れ替えは、所要時間とは別に確保します。ここを0にすると、机上では空いているのに現場が回りません。
4. 4

   長いメニューが埋まらないか確認する

   90分と120分を同じカレンダーに並べると、短いほうから埋まって長い枠が取れなくなることがあります。公開後しばらくは実際の埋まり方を見てください。

ネイルサロンの「オフあり・オフなし」のように、選択で所要時間が大きく変わる業種もあります。その場合のメニューの切り方は ネイルサロンの予約サイトの作り方 にまとめています。

カートの中でオプションはどう見える？

設定が終わったら、お客様の画面でどう見えるかを確認します。置き場ごとに見え方が違います。

1. 商品ページ

   バリエーションは選択肢として出る

   オプション名と値がボタンやプルダウンで並び、選ぶと価格が切り替わります。
2. 商品ページ

   プロパティは入力欄として出る

   自由記入やチェックボックスが、カートに追加ボタンの手前に並びます。
3. カート

   バリエーションは商品名の下

   「料理教室 / 2名・120分」のように、商品名とセットで1行です。
4. カート

   別商品は独立した行

   数量も価格も別に動きます。片方だけ削除できてしまう点に注意します。
5. カート

   プロパティはその行の下に

   「アレルギー: 甲殻類」のように、項目名と値のペアで表示されます。
6. 注文詳細

   すべて注文に残る

   バリエーション、別商品の行、プロパティのいずれも注文データに入ります。

確認しておきたいのは、別商品方式にしたときのカートの見え方です。予約本体とオプションが別々の行になるため、お客様が予約本体だけを削除して、オプションだけが残った注文が飛んでくることがあります。予約商品が入っていないオプション単体の注文をどう扱うかは、運用として決めておいてください。

送料も忘れがちです。オプション商品の「配送が必要な商品」のチェックが外れていないと、その1行のせいでチェックアウトに配送先入力と送料計算が出てきます。予約本体だけ設定して、あとから足したオプション商品で漏れる、というのがよくある順番です。

業種別に、どのオプションをどこへ置く？

同じ「オプション」でも、業種によって置き場の比率がかなり変わります。

公開前に何をテストすればいい？

テスト予約を1回通すと、設定漏れのほとんどはここで見つかります。オプションを足すたびに、この6項目を通してください。

• 全バリエーションに価格が入っている（0円のまま残っていないか）
• オプション商品の「配送が必要な商品」が外れていて、送料が出ない
• 人数券を数量2で買えないよう、カートへの追加制限が効いている
• 必須にした入力欄が、未入力のままカートに追加できない
• 入力内容が注文詳細と注文確認メールの両方に出ている
• 所要時間が違うメニューで、次の枠が正しくふさがる

通知の文面にオプションの内容を出す設定は、予約自動メールの設定方法 にまとめてあります。当日スタッフが管理画面を開かずに済むよう、必要な項目はメールにも載せておくと運用が楽になります。

Shopify予約のオプション設定でよくある質問は？

出典：まるっと予約｜来店・イベント予約（Shopify App Store）

まとめ

予約オプションの設定でつまずく原因は、ほぼ「置き場を決めずに作り始めたこと」です。

アプリを作っている側から見ても、予約オプションの大半はShopifyの標準機能で足ります。アプリが要るのは「枠の長さが動くとき」と「チェックアウトに手を入れたいとき」の2箇所だけです。ここを切り分けておくと、入れるアプリの数も、あとから直す手間も減ります。

→ まるっと予約を7日間無料で試す

→ Shopifyを無料で試してみる

→ Shopify予約アプリ5つを比較