カート機能を使ってカタログ請求作成
商品をカートに入れて注文をするカート機能を利用して、無料の資料請求が行えるフォームを作成します。ユーザーが欲しい資料の部数を選んでリクエストします。
事前準備
小ブログを作成し、その中で実装します。
作成した小ブログのテーマを用意する必要があります。標準で用意されているテーマ /themes/cart@blog2016/を継承した、xxx@cart@blog2016(xxxは任意に)フォルダを用意しておきます。
テーマ設定にて、xxx@cart@blog2016を設定します。
カート機能を有効にする
作成した小ブログの管理ページ > カート よりカート機能を有効に設定します。
今回の例では、実際に印刷されている資料には部数があるものとして、部数以上のリクエストには応えられないようにします。そのため、在庫管理を有効にしておきます。
無料の資料請求にしますので、送料、手数料がある項目は全て0にします。消費税率はそのままで問題ありません。
フォームIDを設定する
cart@blog2016ではテンプレートファイルにフォームIDとして「order」を記述しています。そのまま試す場合はorderの名前でフォームIDを作成しておきます。
メールテンプレートは/mail/order/の中に用意してあります。下記のように設定します。
SubjectTpl | /mail/order/subject.txt |
---|---|
BodyTpl | /mail/order/body.txt |
From | 任意のメールアドレス |
AdminSubjectTpl | /mail/order/adminSubject.txt |
AdminBodyTpl | /mail/order/adminBody.txt |
AdminTo | 任意のメールアドレス |
エントリーを作成する
会社案内、製品パンフレットなど、扱う資料ごとにエントリーを作成します。
注意点として、カート機能を流用している関係上総額が0円だと決済にならないため正常に資料請求ができません。ダミーの価格を記入して登録してください。
カート用のカスタムフィールドは次の場所にファイルが用意されています。
/themes/cart@blog2016/admin/entry/field_foot.html
色選択、サイズは不要です。価格(item_price)は1円(ダミー価格)、在庫数は任意の数字(1以上)、規定外の送料(item_except)は空欄とします。
<table class="entryFormTable acms-form"> <tr> <th>商品名(必須)</th> <td> <input type="text" name="item_name" value="{item_name}" size="40" /> <input type="hidden" name="field[]" value="item_name" /> <input type="hidden" name="item_name:v#required" id="validator-item_name-required" /> <label for="validator-item_name-required" class="validator-result-{item_name:validator#required}"> 商品名を入力してください。 </label> </td> </tr> <tr> <th>在庫数</th> <td> <input type="text" name="item_stock" value="{item_stock}" size="14" /> <input type="hidden" name="field[]" value="item_stock" /> </td> </tr> </table> <input type="hidden" name="item_price" value="1" /> <input type="hidden" name="field[]" value="item_price" /> <input type="hidden" name="item_except" value="" /> <input type="hidden" name="field[]" value="item_except" />
フォームのテンプレート調整
- 入力をさせる必要がないフォーム項目はinput type="hidden"にしてデフォルト値をPOSTするように修正する
- 記入者=発送先でよいため「お届け先のご住所」は「お客様のご住所と同じ」の値にし、項目自体を非表示にする
- 価格や発送方法の項目は見た目に不要なので非表示にする
注意点
カートのフォームでは、商品と数の登録 → 住所の登録 → 配送支払い方法の選択 → 確認 → 完了 とページ遷移をしてお買い物のフローが流れます。今回の資料請求では「配送支払い方法の選択」のステップが不要になります。このページでは個人情報の同意をもとめるページとしてページを使用してください。
課題
「会社案内」「製品パンフレット」のエントリーを作成しておきます。「会社案内」を1部、「製品パンフレット」5部を資料請求フォームから送信し、メールを受信して注文内容が確認できるところまで実施してください。