この注文書の仕組みについて
この注文書が実際にどのように使われるのかを
順番に説明します。
特別な操作や、難しい設定は必要ありません。
スマートフォンだけで完結する仕組みです。
商品一覧
テーブルを使って一覧を作成しました。
大まかに欲しいものを探す場合は一覧のほうが早いからです。
間に画像が入っていると、スクロールをする量が増えます。
そのため、テーブルである程度欲しい商品を絞り込めるようにしています。
「数字だけではわかりにくい」「現物写真を確認したい」に答えるため、
テーブルの記載内容と画像をセットにしたカード状の画像をポップアップで確認できるようにしました。
注文書エリア

テーブルでほしい商品を絞り込んだら、注文書エリアで数量を入力してもらいます。
誤発注を防ためにポップアップで詳細画像が確認できるようにしてあります。
「合計を計算する」ボタンを押します
数量を入力したら、
「合計を計算する」ボタンを押します。
すると、
- 単価 × 数量
- 小計
- 消費税
- 合計金額
が 自動で計算され、画面に表示されます。
「印刷する(PDF保存)」を押します
内容を確認したら、
「印刷する(PDF保存)」を押します。
パソコンだけでなく、
スマートフォンでもPDFとして保存できます。
そのページ全体がPDF化されます。
そのため、
- 注文内容
- 合計金額
- 注文者情報
- 注文日(自動で記録されます)
がすべて記載されます。
このPDFは、
- 注文者の控え
- 正式な注文書
を兼ねています。
フォームからPDFを送信して注文完了
次に、直下のフォームに
注文者の情報を入力してもらいます。
- 氏名
- メールアドレス
- 電話番号
- 住所
- 注文書PDF
送信を押してもらえば注文書が届きます。
この仕組みでできること
この注文書の仕組みを使うことで、
- 注文内容がPDFで残る
- 注文者と販売者が、同じ内容を保管できる
- 注文日が自動で記録される
といった状態を作ることができます。
そのため、
- 「言った/言わない」
- 金額の勘違い
- 注文内容の食い違い
といったトラブルを、
あらかじめ防ぎやすくなります。
特別なシステムは使っていません
この注文書は、
- 専用アプリ
- 会員登録
- 外部の販売サービス
を使っていません。
ホームページの中で完結しています。
そのため、
- 月額費用が増えない
- 必要に応じてカスタムできる
- 将来の変更にも対応しやすい
という特徴があります。
