ホームページマスターTOPページへ
初心者の為のホームページ作成支援サイト powerd by Google
HOME >ネットショップのはじめ方

ネットショップのはじめ方

初心者でも簡単にネットショップをはじめる方法を紹介します。 オンラインで商品を手軽に購入することができるため個人で運営 する人も増えています。

■用意するもの

ネットショップをはじめるにあたり用意するものを挙げると以下のようになります。

  1. レンタルサーバー
  2. 独自ドメイン
  3. ホームページ
  4. 税務署に提出するための開業届
  5. 決済システムを導入する 決済代行サービス(コンビニなど) (自分でPHPプログラムを作る)
  6. 商品
  7. 商品の写真

1番についてはロリポップ! 等の有料レンタルサーバーをレンタルします。趣味の個人サイトの運営とは違いサーバー落ち等があっては ならないので有料のレンタルサーバーを契約する必要があります。

2番についてはお名前.com 等の独自ドメインを取得します。自分が希望する短いURLを作れる、長年運営してアクセス数が増えてくると とインターネット検索で上位に表示されやすい等の利点があります。

3番については当サイトで紹介しているようにHTMLタグとCSSを勉強しメモ帳でホームページを 作成することもできますが長年HPを運営・維持することを考えると ホームページビルダーというソフトで作成、編集するのが手軽です。

■ネットでショップを開設するメリット、デメリット

ネットでショップを開設する場合メリットやデメリットもあります。

メリット
  • 一人で運営する場合、人件費がかからない
  • 一人で運営する場合、自分の思い描いたデザインを反映できる
  • 店舗を持つより維持・管理費が安くて済む

デメリット(運営する上で苦労する点)
  • HPを自由にカスタマイズしたい場合、HTMLやCSSの知識が必要
  • 商品の問い合わせの対応が大変
  • 検索サイトで上位になる必要がありHPの宣伝が大変
  • 顧客の個人情報をセキュリティで守らなければいけない

■注文カートのしくみ

ネットショップで商品を注文する際によく見る注文カートのページが ありますが数量を選択し金額が自動計算されるのはjavascript(jQuery)やPHPプログラム などの言語が使用されています。

下の例ではjavascriptで単価×数量が計算されて各商品の合計金額が表示されるように なっています。(合計1000円未満は送料300円が発生)
初心者の方が自力でネットでショップを立ち上げようとする場合、 前途のデメリットで挙げたHTMLタグとCSSに 加えこのような煩雑なプログラムの知識を時間をかけて習得する必要があります。 記号が構文内に多数あり 1文字でも誤字や脱字があるとプログラムは動作しなくなるという難しさがあります。


【ブラウザ表示】 *サンプルカートのため購入ボタンは機能しません

商品数量
りんご:300円
スイカ:500円
メロン:2000円
送料(合計1000円以上お買い上げの場合は無料)
税抜き合計金額
税込み合計金額


HTMLソース(headタグ、フォームタグ内)

<head><script src="goukei_keisan.js"></script></head>
<form name="form1" method="post" action="xxx">
<table border="1" cellpadding="7" cellspacing="0">
<tr>
<th>商品</th><th>数量</th>
</tr>
<tr>
<td>りんご:300円</td>
<td>
<select onchange="sum()">
<option value="0">0 </option>
<option value="1">1 </option>
<option value="2">2 </option>
<option value="3">3 </option>
</select>個
</td>
</tr>
<tr>
<td>スイカ:500円</td>
<td>
<select onchange="sum()">
<option value="0">0 </option>
<option value="1">1 </option>
<option value="2">2 </option>
<option value="3">3 </option>
</select>個
</td>
</tr>
<tr>
<td>メロン:2000円</td>
<td>
<select onchange="sum()">
<option value="0">0 </option>
<option value="1">1 </option>
<option value="2">2 </option>
<option value="3">3 </option>
</select>個
</td>
</tr>
<tr>
<th colspan="2">計</th>
</tr>
<tr>
<td>送料(合計1000円以上お買い上げの場合は無料)</td>
<td><input type="text" name="shipping" value="0"> 円</td>
</tr>
<tr>
<td>税抜き合計金額</td>
<td><input type="text" name="total" value="0"> 円</td>
</tr>
<tr>
<td><span style="color:red; font-weight:bold;">税込み合計金額</span></td>
<td><input type="text" id="iro" name="total2" value="0"> 円</td>
</tr>
<tr>
<td colspan="2">
<input type="submit" value="購入する"><input type="reset" value="クリア">
</td>
</tr>
</table>
</form>



jsファイル

tanka=new Array();
tanka[0]=300;
tanka[1]=500;
tanka[2]=2000;
// 配列0から2へ各金額の値を代入する

function sum(){
goukei=0;
document.getElementById("iro").style.color = "red";
souryou=0;
for(i=0;i<=2;i++){
num=Number(document.form1.elements[i].options[document.form1.
elements[i].selectedIndex].value);
goukei=goukei+tanka[i]*num;
}
// 関数名sumで最初に合計、送料は0にしておく、HTML内のフォーム内の税込み合計欄の文字は赤色にするという意味。
// iが2以下の間、処理を実行するという意味。
// フォーム名であるform1のselect要素内のoption要素の数字を選択すると数字に値する金額に変わるという意味。

if(goukei<1000 && goukei>0){
goukei+=300;
souryou=300;
alert("送料が発生しますがよろしいですか?");
}
// もし合計が0円より大きく尚且つ1000円未満なら合計金額に送料300円をプラスする、送料欄には300円を表示するという意味、その際送料が発生する旨のメッセージを出すという意味。

document.form1.shipping.value=souryou;
document.form1.total.value=goukei;
document.form1.total2.value=goukei*108/100;
}
// HTML内のフォーム内の送料のテキストボックスに表示させる。
// HTML内のフォーム内の税抜き合計金額のテキストボックスに表示させる。
// HTML内のフォーム内の税抜き合計金額のテキストボックスに表示させる、
合計計算に誤差が出るため1.08を掛けるのではなく整数演算で記述する。

■ネットショップのサービスを利用する

ネットショップを自分で一から立ち上げるには前途のように大変な 労力と時間を要します。
しかし カラーミーショップ 【らくうるカート】 のようなネットショップのサービスを利用する ことでHP作成やプログラムを打ち込んだりする必要もなく 初心者でも手軽にスタートすることが可能です。 冒頭で挙げた用意するものも減らすことができ開店に関するサポート体制も整っています。

利用者の作成事例が写真付きで紹介されておりそちらを参考にすることで自分が始めたいと思っている HPのイメージをしやすくなります。


HOME

Copyright (C) 2003-2019 ホームページマスター All rights reserved.