*This website uses 'Fly-out Help' (more info)

Ecommerce Using HTML Forms

This page describes the HTML Form based OzeWebHost shopping cart and secure ecommerce system.

The cart has 4 components:

• A merchant account is setup by OzeWebHost staff defining access userid and password, invoice information, etc.
• Product information (name, price, quantity, weight, photo, etc) is in HTML forms on the merchant's web pages. There can be one HTML form per product (one product is bought at a time) or several products can be placed in one form (tick products or fill in non zero quantities then submit the whole selection). Web designers can layout sites whichever way they wish.
• Server based programs and database keep track of orders and payments.
• Shipping categories determine postage and handling costs.

There is an alternative to hard coding a product catalogue in the website. OzewebHost has a database catalogue option. This option allows easy update of a frequently changing catalogue and also provides stock control, preventing sale of more stock than the merchant can supply. See Database Driven Ecommerce for details.

Ozewebhost also offers online credit card transactions using eWAY.

Work Flow

A customer browses through the merchant's website and finds a product he/she wishes to buy. The customer clicks on the order button and the product name, cost, quantity, weight, etc and the merchant's id (all contained in the product's html form) are posted to a program on the server (the merchant's domain). The program adds the product ordered to the customer's current order, calculates postage and handling cost, then lists the updated order on the customer's browser (in a popup window). The customer may be requested to answer a question about their location so freight costs can be calculated. The customer can continue shopping or proceed to payment. When he/she proceeds to payment, the process switches to an encrypted ssl server on www.townseek.com.au. The customer enters personal information - name, address, etc - then their credit card details. After this they are presented with a receipt or tax invoice.

The order is held on the server (the card number is encrypted) and an email is sent to the merchant. The merchant then, using their browser, logs onto the secure ssl server and retrieves the order. They print or save the order then press the button, deleting the order from the server. They then use their own merchant facilities (EFTPOS or on paper) to process the order.

The Product HTML Form

On the merchant's web site, each product requires its own HTML form. The form contains various elements - 3 mandatory hidden elements, a couple of optional elements and any other form element required for product options. For example:

<form action="/servlets/EcoPutOrder" method="post" target="order"
                         onSubmit="return showWin();">
  <input type="hidden" name="merchant" value="teddyshop">      required
  <input type="hidden" name="product" value="Fat Teddy Bear">  required
  <input type="hidden" name="cost" value="24.90">              required
  <input type="hidden" name="weight" value="0.025">
  Fat Teddy Bear - $24.90<br>
  Quantity: <input type="text" name="quantity" value="1">
  <select name="Colour">
    <option value="Brown">Brown</option>
    <option value="Polar white">Polar white</option>
  </select>
  <br><br>
  <input type="Submit" value="Order">
</form>

The first three form elements describe the merchant's id (teddyshop), the product name (Fat Teddy Bear) and the cost (24.90). These are hidden elements, not displayed to the customer, but are required by the server programs.

The fourth element, also hidden, is the weight in kilograms. If its value is prefixed with * (value="*0.025") then the postage cost is calculated assuming the product is packaged and mailed separately.

The quantity element is filled in by the customer and is used by the server to calculate the total cost. The other elements (eg Colour) will be displayed in the shopping cart order listing, under the product, in the format name: value (same order as the form). You can use select, text, checkbox and radio button elements.

You may also wish to show 100x100 images in the order listing. Just add the hidden element:

<input type="hidden" name="image" value="fatteddy.jpg">

If you wish to make some fields mandatory (other than product, cost and merchant), say the colour and type, then add the hidden element:

<input type="hidden" name="require" value="colour,type">

For products that don't attract GST (tax), you may add the hidden element:

<input type="hidden" name="nogst" value="yes">

Normally, when the customer clicks "continue shopping" the order display window disappears, leaving the original page showing the product the customer just ordered. If, instead, you would like to go to another page after the "continue shopping" is clicked, then add this hidden element to the product form:

<input type="hidden" name="href" value="http://teddyshop.com.au/somepage.html">

You may want the customer to download a file after the acquisition is complete. Place the file in the directory "downloads", created in the merchant's user root directory (not under "www"). Then insert another hidden element into the form. The following example will cause a link to be placed on the invoice/receipt allowing the customer to download "teddy.jpg". The customer is given three attempts in three days to download the file. :

<input type="hidden" name="command" value="dl-teddy.jpg">

Note the file name is prefixed by "dl-".

The form action calls a javascript function to pop up a window with a target name of order. Place the following function in the HTML header:

<script language="JavaScript">
  function showWin()
    {
    window.name='origin';
    var w = window.open('','order',
        'width=500,height=400,resizable,scrollbars,status');
    w.document.clear();
    w.focus();
    return true;
    }
</script>

Server based programs

Each product form action attribute links to:

/servlets/EcoPutOrder

This program adds the product to the customer's total order.

To just display the total order without ordering a product, use the following link:

<a href="/servlets/EcoListOrder?id=teddyshop" target="order"
  onClick="return showWin();">List order/Proceed to payment</a>

Merchant Account Information

OzeWebHost requires the following account information:

A merchant id:
    teddyshop
A userid:
    teddy
OzeWebHost will define an initial password:
    shhteddy
The business name:
    The Teddy Shop
Short business name:
    Teddy Shop
The eWAY account id if the merchant requires online credit card transactions:
    gwya8727
The email address (where the order notifications go):
    teddy@teddyshop.com.au,webmaster@teddyshop.com.au
The url that loads after the credit card entry and invoice is complete:
    http://www.teddyshop.com.au/index.html
The server name:
    teddyshop.com.au
The root directory of the domain:
    /home/teddysho/www
The directory containing the logo and any 100x100 images:
    /images
The logo that appears on top of the order listing, payment pages and invoice:
    logo.jpg
The business information appearing on the invoice:
    The Teddy Shop
    ABN 12 345 678 910
    123 Street Rd
    Sometown
    NSW 2468
    Australia
    Tel: 1234567
    Fax: 7654321
    Email: teddy@TeddyShop.com.au
The currency to be displayed on the order:
    (AUD)
List of acceptable credit cards, comma separated:
    Bankcard,Visa,Mastercard,Amex
Require a Tax Invoice rather than a receipt ?:
    Yes
Note to be printed on the invoice/receipt:
    (All prices include GST)

Shipping and Handling

There are three methods of calculating shipping costs:

• Default - there is no cost on shipping.
• Simple - there is a single selection list to choose from. Each entry in the list is a shipping category and results in a different formula to be applied to the product weights.
• Complex - The customer selects their country and then, if required, their state. They can then possibly choose from a list of delivery services (surface, airmail, etc).
  The merchant or OzeWebHost staff set up shipping categories (with formula to be applied to product weights) and assign countries or states to each category. The same set of countries/states may be assigned to more than one category, each category being for a different delivery service.

Each shipping category defines a base value and a rate per Kg. A component for a proportion of the total cost of the items can also be added. So if the total weight of an order is 2Kg, the base is $2.35 and the rate per Kg $3.40, and insurance is 5% of the item cost $55.00, then the shipping cost would be
    2.35 + 2 x 3.4 + 0.05 x 55= $11.90
Any product specified as packed and posted separately would have its shipping calculated separately.

The merchant can edit their shipping categories by clicking on a link after going to https://www.townseek.com.au/ecoorders.html, and logging on.

More details on Shipping Categories

Clear as mud!

Ozewebhost Pty Ltd

Park Road, Nowra, NSW 2541 Australia
Telephone: +61 (0)2 4423 0644
Email: info@ozewebhost.com