専用サーバープランProfessional版

数量を指定して注文するボタンの設置方法

注文前に個数を指定することができます。1回あたりの注文個数が多い商品におすすめです。

プルダウン選択型

ソース内のショップID・商品番号を書き換えてご利用ください。

<form action="https://〇〇.〇〇.shopmaker.jp/cgi-bin/order.cgi">
										  <input type="hidden" name="user" value="ショップID">
										  <input type="hidden" name="number" value="商品番号">
										数量<select name="kosuu">
										<option value="1">1</option>
										<option value="2">2</option>
										<option value="3">3</option>
										<option value="4">4</option>
										<option value="5">5</option>
										<option value="6">6</option>
										<option value="7">7</option>
										<option value="8">8</option>
										<option value="9">9</option>
										<input type="submit"  value="買い物かごに入れる">
									</form>
								

※〇〇.〇〇はショップ様によって異なります。ID発行時の「【要保存】SHOP-Maker 専用サーバープランID発行通知」に記載のサーバーNoに置き換えてご利用ください。

※一度に選択できる数量は20個までです。

・管理画面>オプション>サンプルソース>選択式注文ボタン>
数量選択型(プルダウン選択)
で「サンプルソースを見る」を押すと
ソースを表示できます。

サイトに設置したイメージ

ケーキ

ショートケーキ/1個350円
↓デモ購入はこちらから

数量

※実際にデモ購入を試したり、注文の流れを確認できます。

※注文画面で購入個数を指定することができます。

※デモ購入はスタンダードサーバープランのProfessional版カートを使用しています。

オリジナル画像の注文ボタンに変更したい場合はこちら⇒

テキスト入力型

数量を手入力する方法とマウス操作で入力する方法がございます。

手入力で数量を指定するフォーム

ソース内のショップID・商品番号を書き換えてご利用ください。

<form action="https://〇〇.〇〇.shopmaker.jp/cgi-bin/order.cgi/">
									<input type="hidden" name="user" value="ショップID">
									<input type="hidden" name="number" value="商品番号">
									数量<input type="text" size="2" name="kosuu" value="1">
									<input type="submit" value="買い物かごに入れる">
									</form>
								

※〇〇.〇〇はショップ様によって異なります。ID発行時の「【要保存】SHOP-Maker 専用サーバープランID発行通知」に記載のサーバーNoに置き換えてご利用ください。

※一度に選択できる数量は999個までです。

・管理画面>オプション>サンプルソース>選択式注文ボタン>
数量選択型(テキスト入力)
で「サンプルソースを見る」を押すと
ソースを表示できます。

サイトに設置したイメージ

ケーキ

ショートケーキ/1個350円
↓デモ購入はこちらから

数量

※実際にデモ購入を試したり、注文の流れを確認できます。

※注文画面で購入個数を指定することができます。

※デモ購入はスタンダードサーバープランのProfessional版カートを使用しています。

オリジナル画像の注文ボタンに変更したい場合はこちら⇒

マウス操作で数量を指定するフォーム(手入力可能)

ソース内のショップID・商品番号を書き換えてご利用ください。

(1)<head>~</head>の間に以下のソースを貼り付けます。

<sctipt type="text/javascript" src="https://www.shopmaker.jp/script/nfield.jp">

(2)以下のソースを設置したい場所に貼り付けます。

<form action="https://〇〇.〇〇.shopmaker.jp/pro/order.cgi/">
									<input type="hidden" name="user" value="ショップID">
									<input type="hidden" name="number" value="商品番号">
									<table>
									<tr>
									<td>数量</td>
									<td>
									<script type="text/javascript">
									<!--
									new NField();
									-->
									</script>
									</td>
									<td>
									<input type="submit" value="買い物かごに入れる">
									</td>
									</tr>
									</table>
									</form>
								

※〇〇.〇〇はショップ様によって異なります。ID発行時の「【要保存】SHOP-Maker 専用サーバープランID発行通知」に記載のサーバーNoに置き換えてご利用ください。

※一度に選択できる数量は999個までです。

・管理画面>オプション>サンプルソース>選択式注文ボタン>
数量選択型(クリック入力)
で「サンプルソースを見る」を押すと
ソースを表示できます。

サイトに設置したイメージ

ケーキ

ショートケーキ/1個350円
↓デモ購入はこちらから

数量

※実際にデモ購入を試したり、注文の流れを確認できます。

※注文画面で購入個数を指定することができます。

※デモ購入はスタンダードサーバープランのProfessional版カートを使用しています。

オリジナル画像の注文ボタンに変更したい場合はこちら⇒

■サイトに貼り付けると体裁が崩れる場合や数量の初期値を変更する場合は、赤字の部分を下記ソースに変更してください。

サイトに貼り付けると体裁が崩れる場合・・・

												<script type="text/javascript">
														<!--
														new NField( { std: 1} );
														-->
												</script>
											

数量の初期値を変更する場合・・・(例:初期値を0→1)

												<script type="text/javascript">
														<!--
														new NField( { def: 1} );
														-->
												</script>
											

サイトに貼り付けると体裁が崩れる場合・・・

												<script type="text/javascript">
														<!--
														new NField( { def: 1, std: 1} );
														-->
												</script>
											

オリジナル画像を注文ボタンにする場合

■注文ソース内の(A)「買い物かごに入れる」ボタンのソースを(B)のソースに変更します。

(A)

										<input type="submit" value="買い物かごに入れる">
									

(B)

										<input type="image" src="画像" border="0">
									

※「画像」には[https://~」から始まるURLをご入力ください。
   例)https://www.shopmaker.jp/img/button.gif/

サイトに設置したイメージ

ケーキ

ショートケーキ/1個350円
↓デモ購入はこちらから

数量

※実際にデモ購入を試したり、注文の流れを確認できます。

※注文画面で購入個数を指定することができます。

※デモ購入はスタンダードサーバープランのProfessional版カートを使用しています。