カスタマイズProfessional版

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

プルダウン選択型の場合

■ソース内のショップID、商品番号を書き換えてそのままご使用いただけます。

以下のソースを設置したい場所に張ります。

 
商品イメージ

ショートケーキ/1個350円

↓デモ購入はこちらから

数量

※ 実際にデモ購入を試したり、注文の流れを確認できます。
※ 注文画面で個数を指定することができます。

<form action="https://www.shopmaker.jp/カートタイプ/ショップID/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>
</select>

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

※カートタイプやショップIDはお客様によって異なります。ID発行時に送信されているメール「【要保存】SHOP-Makerカスタマイズ版ID発行通知!」に記載のサーバーNOに置き換えてご利用ください。

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

□管理画面 > オプション >サンプルソース
ソースを確認することができます。

テキスト入力型の場合

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

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

■ソース内のショップID、商品番号を書き換えてそのままご使用いただけます。

以下のソースを設置したい場所に張ります。

 
商品イメージ

ショートケーキ/1個350円

↓デモ購入はこちらから

数量

※ 実際にデモ購入を試したり、注文の流れを確認できます。
※ 注文画面で個数を指定することができます。

<form action="https://www.shopmaker.jp/カートタイプ/ショップID/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はお客様によって異なります。ID発行時に送信されているメール「【要保存】SHOP-Makerカスタマイズ版ID発行通知!」に記載のサーバーNOに置き換えてご利用ください。

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

□管理画面 > オプション > サンプルソース >
注文する際に数量指定をしたい。 > (b) テキスト入力型

ソースを確認することができます。

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

■ソース内のショップID、商品番号を書き換えてそのままご使用いただけます。

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

 
商品イメージ

ショートケーキ/1個350円

↓デモ購入はこちらから

数量

※ 実際にデモ購入を試したり、注文の流れを確認できます。
※ 注文画面で個数を指定することができます。

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


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

<form action="https://www.shopmaker.jp/カートタイプ/ショップID/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はお客様によって異なります。ID発行時に送信されているメール「【要保存】SHOP-Makerカスタマイズ版ID発行通知!」に記載のサーバーNOに置き換えてご利用ください。

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

□管理画面 > オプション > サンプルソース >
注文する際に数量指定をしたい。 > (b) テキスト入力型

ソースを確認することができます。

■次のような場合、赤字部分を下記ソースに変更してご利用ください。

! サイトに貼り付けると体裁が崩れてしまう場合…

! 数量の初期値を変更したい場合…(例:初期値を0→1)

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

! 数量の初期値を変更し、かつ体裁が崩れてしまう場合…

  <script type="text/javascript">
     <!--
     new NField( { def: 1,std: 1} );
     -->
    </script>
 
作成した画像を注文ボタンにする場合

■上に表記している注文ソース内の(A)の部分を(B)のソースに変更します。

(A)

 
商品イメージ

ショートケーキ/1個350円

↓デモ購入はこちらから

数量

※ 実際にデモ購入を試したり、注文の流れを確認できます。
※ 注文画面で個数を指定することができます。

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


(B)

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

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