注文フォームコンテンツを作成する方法
コンテンツタイプ:注文フォーム
会員情報の呼び出し機能もできる注文フォームを作成できます。
コンテンツ作成
歯車マーク:コンテンツ管理 > コンテンツ作成
コンテンツタイプ「注文フォーム」を選択し、コンテンツを新規作成します。
あらかじめ用意されたサンプルデザイン(コンテンツID:pay_item
)を複製・編集して、コンテンツを作成することも可能です。
変数の利用方法などもご確認ください。
コンテンツ情報 / コンテンツ設定
次に、ページ全体の閲覧・表示制御などを行います。
コンテンツタイプ | 作成するコンテンツタイプを表示。 |
---|---|
コンテンツURL | https://システム設置先/contents.php?c=コンテンツID ※コンテンツIDを変更するとURLも変更されます。 |
コンテンツID | コンテンツURLに使用されるID。 ※新規作成時に指定したID。省略時は自動で付与されます。 |
---|---|
カテゴリー名 | 管理用にカテゴリ分けする場合は設定。省略した場合は「未設定」に振り分けます。 |
コンテンツ名 | コンテンツの管理名称。 |
入力フォームの 必須項目設定 |
フロント側で入力チェックを行う項目を設定。 ※「氏名」「メールアドレス」は自動的に必須項目となります。 |
公開範囲 | 作成したコンテンツの公開範囲を設定。 ※「会員」に指定した場合、未ログイン(一般)には公開されません。 |
閲覧権限外の転送URL | 「公開範囲」に設定していない権限でアクセスした場合の転送先URL。 |
対象デバイス | 閲覧が可能な端末を設定 ※レスポンシブの場合、「PC」「スマートフォン」両方にチェックを入れてください。 |
対象外デバイスの転送URL | 「対象デバイス」で設定していない端末からアクセスした場合の転送先URL。 |
BASIC認証 | コンテンツ閲覧時にBasic認証をかける場合に設定。 |
公開設定 | 公開状態を設定。 |
テンプレートHTML
入力画面HTML
【入力画面HTML】では、コンテンツのベースとなるHTMLを記述します。
変数名 | 変数 |
---|---|
会員メールアドレス【引数対応($1)】 会員パスワード 会員情報呼び出しボタン |
[user_mail] [user_pass] [user_button] |
氏名【引数対応($1)】 氏名(フリガナ)【引数対応($1)】 メールアドレス【引数対応($1)】 電話番号【引数対応($1)】 郵便番号(左)【引数対応($1)】 郵便番号(右)【引数対応($1)】 住所(都道府県)【引数対応($1)】 住所(市区町村)【引数対応($1)】 住所(番地・建物名)【引数対応($1)】 |
[name] [name_ruby] [mail] [tel] [add_num1] [add_num2] [add_pre] [add_city] [add_last] |
配送先選択ラジオボタン | [delivery_check] |
配送先(購入者に配送) | [delivery_check_hidden] |
【配送先|引数対応($1)】氏名 【配送先|引数対応($1)】氏名(フリガナ) 【配送先|引数対応($1)】電話番号 【配送先|引数対応($1)】郵便番号(左) 【配送先|引数対応($1)】郵便番号(右) 【配送先|引数対応($1)】住所(都道府県) 【配送先|引数対応($1)】住所(市区町村) 【配送先|引数対応($1)】住所(番地・建物名) 【配送先|引数対応($1)】備考 |
[adds_name] [adds_name_ruby] [adds_tel] [adds_add_num1] [adds_add_num2] [adds_add_pre] [adds_add_city] [adds_add_last] [remarks] |
カード番号【引数対応($1)】 有効期限(年) 有効期限(月) セキュリティーコード【引数対応($1)】 カード名義【引数対応($1)】 |
[card_num] [card_y] [card_m] [card_code] [card_name] |
フリー項目1~5【引数対応($1)】 | [free1]~[free5] |
決済方法 | [pay_type] |
マルチ決済(決済手段)(/) マルチ決済(決済手段)(<br>) マルチ決済(決済手段)(<li></li>) マルチ決済(決済手段)(<span></span>) |
[pay_link_type_slash] [pay_link_type_br] [pay_link_type_li] [pay_link_type_span] |
商品リスト(一覧HTML) | [list] ※【一覧挿入HTML】の記述が表示されます。 |
商品リスト定期(一覧HTML) | [fixed_list] ※【定期・頒布会一覧挿入HTML】の記述が表示されます。 |
商品合計(通常商品のみ)(桁区切りなし) (桁区切りあり) 商品合計(定期、頒布のみ)(桁区切りなし) (桁区切りあり) 商品合計(桁区切りなし) (桁区切りあり) |
[total_cost_item] 出力例:1000 [total_cost_item_format] 出力例:1,000 [total_fixed_item_cost] 出力例:1000 [total_fixed_item_cost_format] 出力例:1,000 [total_cost] 出力例:1000 [total_cost_format] 出力例:1,000 |
確認ボタン | [form_check_button] |
注文日時 | [regist] |
エラー挿入位置(エラー挿入HTML) | [error] ※【エラー挿入HTML】の記述が表示されます。 |
フォーム開始タグ フォーム開始タグ(確認画面なし) フォーム終了タグ |
[form_start] [form_start_skip] [form_end] |
引数対応($1)の変数 |
---|
セレクタ指定(class、idなど)をすることができます。
記述例:[name:class="form_name"] 出力例:<input type="text" name="name" value="" size="40" maxlength="255" class="form_name"> |
- Attention
フォームを作成する場合、必ずフォームスタートの変数:
[form_start]
とフォームエンドの変数:[form_end]
を配置します。
エラー挿入HTML
【エラー挿入HTML】編集エリアでは、「入力フォームの必須項目設定」に基づいた不備があった場合のエラー表示を記述します。
エラー表示は、【入力画面HTML】で「エラー挿入位置(エラー挿入HTML)」変数: [error]
の記述のある箇所に出力されます。
▼エラー挿入画面:フロント側表示とコンテンツ変数の記述例
変数名 | 変数 |
---|---|
エラーメッセージ(/) エラーメッセージ(<br />) エラーメッセージ(<li></li>) エラーメッセージ(<span></span>) |
[error_message_slash] [error_message_br] [error_message_li] [error_message_span] |
※エラーのメッセージ内容はシステム内で設定されているため変更することはできません。
一覧挿入HTML
【一覧挿入HTML】編集エリアでは、【入力画面HTML】で「商品リスト(一覧HTML)」変数: [list]
で出力する内容を記述します。
▼一覧挿入画面:フロント側表示とコンテンツ変数の記述例
変数名 | 変数 |
---|---|
商品ID 商品名 商品タイプ 商品URL キャッチコピー 商品説明 商品画像1~10(URL) (imgタグ) 商品オプションリスト(一覧HTML) |
[item_id] [name] [item_type] [item_url] [item_title] [item_text] [item_image1]~[item_image10_img] [item_image1_img]~[item_image10_img] [option_list] ※【商品オプション一覧挿入HTML】の記述が表示されます。 |
商品個数 | [item_row] |
販売価格(桁区切りなし) (桁区切りあり) 単価合計(桁区切りなし) (桁区切りあり) 商品小計(桁区切りなし) (桁区切りあり) |
[price] [price_format] [price_total] [price_total_format] [item_cost] [item_cost_format] |
定期・頒布会一覧挿入HTML
【定期・頒布会一覧挿入HTML】編集エリアでは、【入力画面HTML】の「商品リスト定期(一覧HTML)」変数: [fixed_list]
で出力する内容を記述します。
▼定期・頒布会一覧挿入画面:フロント側表示とコンテンツ変数の記述例
変数名 | 変数 |
---|---|
定期・頒布会商品ID 定期・頒布会商品名 商品種別 商品URL キャッチコピー 商品説明 定期・頒布会商品画像(URL) (imgタグ) 商品オプションリスト(一覧HTML) |
[fixed_item_id] [fixed_name] [fixed_item_type] [fixed_item_url] [fixed_item_title] [fixed_item_text] [fixed_item_image1] [fixed_item_image1_img] [option_list] ※【商品オプション一覧挿入HTML】の記述が表示されます。 |
商品個数 | [fixed_item_row] |
初回価格(桁区切りなし) (桁区切りあり) 初回価格オプション価格含む(桁区切りなし) (桁区切りあり) 通常価格(桁区切りなし) (桁区切りあり) 通常価格オプション価格含む(桁区切りなし) (桁区切りあり) 商品小計(桁区切りなし) (桁区切りあり) |
[start_price] [start_price_format] [start_price_total] [start_price_total_format] [default_price] [default_price_format] [default_price_total] [default_price_total_format] [fixed_item_cost] [fixed_item_cost_format] |
商品オプション一覧挿入HTML
【商品オプション一覧挿入HTML】編集エリアでは、【注文一覧HTML】と【定期・頒布会注文一覧HTML】の
「商品オプションリスト(一覧HTML)」変数: [option_list]
で出力する内容を記述します。
▼商品オプション一覧挿入画面:フロント側表示とコンテンツ変数の記述例
変数名 | 変数 |
---|---|
商品オプション名 | [option_name] |
商品オプションID | [option_id] |
オプション選択肢名 | [option_select_name] |
オプション選択肢名(省略表示) | [option_select_short] |
オプション選択肢ID | [option_select_id] |
確認画面HTML と 注文完了画面HTML
【確認画面HTML】と【完了画面HTML】の編集エリアでは、フォーム入力後の確認画面と、その次の完了ページを記述します。
確認画面HTMLの作成は、入力画面HTMLで記述したソースコードをそのまま使用することで作成が可能です。
※確認画面HTMLにも[form_start]
と[form_end]
の変数は必要です。
完了画面HTMLはサイトのトップページへのリンクを設定することが一般的です。
PayPal決済画面HTML
【PayPal決済画面HTML】編集エリアでは、PayPalに遷移後、本カートに戻ってきた際に表示する内容を記述します。
通常は「完了画面HTML」と同じ内容で作成します。