注文フォームは用途に合わせて2種類あります。いずれも商品写真と税込価格を表示し、複数の商品をまとめて注文できます。
| 入力ページ | 用途 | 商品設定のキー |
|---|---|---|
index-delivery.php |
当日のデリバリー・店頭受取。できるだけ早く、または時刻指定で受付 | delivery |
index-order.php |
通販・取り寄せ注文。お届け先・希望受取日・配送時間帯を受付 | shipping |
商品を選び、共通の確認画面で内容を確認して送信します。注文・お届け日時は店舗からの連絡で確定します。このパッケージには決済、在庫管理、配達手配、配送追跡の機能はありません。
商品を変更する
form/php/config/catalogs.php を開き、変更したい delivery または
shipping の
items
を編集します。写真・商品名・説明・税込価格・数量上限・販売状態はこのファイルで管理します。
'coffee-beans' => [
'name' => 'オリジナルブレンド豆 200g',
'description' => '毎日の一杯に。香りとコクのバランスがよいブレンド。',
'price' => 1400,
'image' => 'form/images/products/coffee-beans.png',
'alt' => 'オリジナルブレンド豆の商品写真',
'max_quantity' => 20,
],
| 設定 | 変更する内容 |
|---|---|
coffee-beans などのキー |
商品ID。商品ごとに重複しない半角英字・数字・ハイフンを使う |
name |
商品名。入力画面・確認画面・メールの明細に表示 |
description |
入力画面に表示する短い説明 |
price |
1点あたりの税込価格。1400 のように円単位の整数で指定 |
image |
package/ からの画像の相対パス |
alt |
写真の内容が伝わる説明 |
max_quantity |
1回の注文で選べる、その商品の最大数量。正の整数で指定 |
enabled |
false で販売休止。省略または true なら表示 |
price に
1,400、1400円、小数は入れません。通貨は日本円で、税率別の内訳計算は行いません。数量0は未購入を表し、初期設定では各商品0〜20点、全商品で1点以上を選ぶ必要があります。
商品を追加・休止する
たとえば通販へ紅茶を追加する場合は、shipping の
items の内側に次の要素を追加します。写真ファイルも指定先に用意してください。
'tea-bags' => [
'name' => '紅茶ティーバッグ 10袋セット',
'description' => '毎日のお茶の時間に楽しめる紅茶です。',
'price' => 1100,
'image' => 'form/images/products/tea-bags.png',
'alt' => '紅茶ティーバッグ10袋セットの商品写真',
'max_quantity' => 10,
'enabled' => true,
],
商品カードは設定から自動で追加されます。forms.php
の項目や、確認・完了のPHPを商品ごとに追加する必要はありません。並び順は
items に書いた順です。
販売を休止する場合は、対象商品に
'enabled' => false
を追加します。その商品は入力画面に表示されず、古い入力情報に残っていても注文時の検証で受け付けません。商品IDを変更・削除した場合も、古い下書きからは選び直しが必要になります。
写真を差し替える
画像を form/images/products/ に配置し、該当商品の image と
alt
を変更します。現在のサンプルは横4:縦3で、同じ比率に揃えると商品一覧が整います。画像だけ同じファイル名で差し替えることもできます。
同梱8点は生成したサンプル商品画像です。生成記録は SOURCES.mdにあります。実際の商品を受け付ける場合は、販売する商品の写真・説明・価格に差し替えてください。
配達料・送料を変更する
配達料・送料も catalogs.php の各商品設定にあります。次はデリバリーの初期設定です。
'method_field' => 'receive_method',
'methods' => ['配達', '店頭受取'],
'fee' => 300,
'fee_label' => '配達料',
'waive_fee_for' => ['店頭受取'],
'currency' => 'JPY',
fee は注文1件につき加算する税込の固定額、fee_label
は明細に表示する名称です。初期設定は配達料300円、通販の送料600円です。waive_fee_for
に指定した受取方法では、この料金が0円になります。店頭受取の初期設定も0円です。
受取方法の名称や選択肢を変える場合は、catalogs.php の
methods・waive_fee_for、forms.php の
receive_method の options と関連する
required_if、入力ページの選択肢を同じ値に揃えてください。地域・注文金額によって送料を変える計算は現在含んでいません。
金額計算と確認・メール
入力画面は商品ごとの数量から小計を計算し、選択した受取方法の配達料・送料を加えて合計を表示します。確認画面ではPHPが
catalogs.php
の価格を使って計算し直します。ブラウザーから送られた商品名・価格・合計額は使いません。
たとえばブレンド豆1,400円を2点、クッキー980円を1点選ぶと、商品小計は3,780円です。配送は送料600円を加えて4,380円、店頭受取は3,780円になります。
確認画面と管理者・自動返信メールには、商品名・単価・数量・商品ごとの小計・配達料／送料・合計（税込）を表示します。「入力内容を修正」で戻ると商品ごとの数量が復元されます。確認・完了・エラーは共通PHPを使い、thanks-order.php
のような用途別ファイルは増やしません。
デザインを変更する
2種類の注文ページは、初期CSSに商品カード用のCSSを加えています。
<link rel="stylesheet" href="./form/css/reset.css">
<link rel="stylesheet" href="./form/css/style.css">
<link rel="stylesheet" href="./form/css/addon/order-cart.css">
デザインを変更するときは、2行目だけを
./form/css/design-06/style.css などへ差し替えます。3行目の
addon/order-cart.css
はその後に残してください。商品設定や数量・金額の計算処理は共通で利用します。
変更後の確認
- 写真・商品名・税込価格が設定した内容で表示されることを確認します。
- 2種類以上の商品を選び、数量・商品小計・配達料／送料・合計を確認します。
- 店頭受取へ切り替え、配達料／送料が0円になることを確認します。
- 確認画面の明細を確認し、修正で戻って数量が復元されることを確認します。
- 商品が0点の場合、数量が上限を超える場合、必要な届け先や希望時刻が空の場合にエラーになることを確認します。