The Shopping Cart program allows visitors to your on-line
shopping site to collect items in a virtual shopping cart. They
may view the contents of their shopping cart at any time and may
add or delete items at will. The program automatically calculates
the subtotal, sales tax, shipping charges, and grand total. When
a visitor decides to check-out, the order information
including the buyer's name, address and billing instruction is
e-mailed to your order department (or whomever you choose) and a
receipt is sent to the shopper.
Features
- Mails order to one or two e-mail addresses
- Sends receipt to customer
- Accommodates up to four types of shipping
- Allows owner to predefine sales tax based a specific
state
- Tracks purchases even if user clicks the back
button
- Tracks each customer by Shopper ID (SID) (does not use
cookies)
What This Program Does Not Do
- It cannot keep track of a visitor if the visitor leaves
the site
- It does not calculate exact shipping costs. It can
calculate a base rate plus an additional charge per item,
based on up to 4 different shipping methods that you
create. However, it cannot calculate shipping charges
based on weight, size, or zone.
- It does not perform on-line payment. It can be integrated
with an on-line payment program such as Cybercash or
First Virtual, but these are not included in the Shopping
Cart script.
- It does not securely transmit credit card payment
information. You can use our SSL server to safely
transmit the credit card and order information from the
customer to our computers, but the resulting order that
is e-mailed from the Shopping Cart script to the
person(s) you specify is not secure. You may wish to have
users print the generated order form and mail or fax it
to you.
Implementation
The Shopping Cart is actually quite easy to implement. You do not
need to know PERL or any other programming language and you don't
need to be an expert webmaster. Just follow the simple steps
outlined below and you should be up and running in no time.
- Install the Shopping Cart software
- Edit the configuration file
- Create your product list
- Modify your web pages to include the
shopping cart feature
Note: You may wish to print out this page so you can follow
along as you work through each of the steps.
Hassan
Consulting's documentation
1. Install
the Shopping Cart Software
To install the shopping cart software within your web
site:
- Access your account Control Panel
- Select Shopping Cart Generator
- Click the YES button to install files
*** CAUTION! This will cause any
existing version of this shopping cart to be over-written.
The installation will create a subdirectory within your
web site called /shop which
contains several HTML files used in a demonstration as well
as a /lists directory and a /tmp
directory which are used by the Shopping Cart program. A
shopping cart script (shop.pl) and
a configuration file (shop.cfg)
will be placed within your /cgi-local
directory. After installation, a prompt will appear to refer
you to the newly installed demonstration within your web
site.
Demo files inside /shop/
Use these files as an example.
You may delete them when you
create your own pages.
--------------------------------
cdrom.html
done.html
email.html
harddrives.html
list.html
modem.html
shop.html
tapes.html
product_list.txt
/picts/ (images used in demo)
2. Edit
the configuration file
2a. Download the Configuration File
Use an FTP program to download the
newly installed Shopping Cart configuration file (shop.cfg)
to your computer. The file is located in your /cgi-local
directory.
*** Be sure to download the shop.cfg
file in ASCII transfer mode (not binary mode).
After the configuration file is downloaded to your
computer you can edit it with any text editor of your choice,
such as Notepad, WordPad, or TeachText. Just remember to save
your edited version as a 'text only' document and make sure
you keep the file name the same.
2b. Specify to what e-mail address(es) you want the
order to be sent.
As mentioned, the Shopping Cart script has the ability to
mail orders to one or two e-mail addresses. These addresses
are specified within the shop.cfg
file in a section titled '# mailing info' as shown below:
| # mailing info
$admin = ''; # who to mail the order to
$admin1 = ''; # second person to mail the order to
|
Type the e-mail address of the person to whom you want the
orders sent between the pair of single quotes following the $admin
variable names as in this example:
| # mailing info
$admin = 'johndoe@john.com'; # who to mail the order to
$admin1 = 'janedoe@jane.com'; # second person to mail the order to
|
*** To specify a single email
address, merely leave the second variable empty.
*** IMPORTANT! You MUST keep the single quotes surrounding
the email addresses.
2c. Specify the Sales Tax Rate for your State.
The Shopping Cart script will automatically calculate the
Sales Tax for an order provided you specify the two letter
postal code and tax rate for your state. If the two letter
postal code in the billing address of a user matches the
postal code you specify, then the appropriate sales tax will
be added to the order according to the tax rate you specify.
The sales tax is specified within the shop.cfg
file in a section titled '# current tax rate and states' as
shown below:
| # current tax rate and states
$tax_state = "FL"; # State in uppercase
$tax_state2 = "fl"; # State in lowercase
$tax_rate = ".06"; # 6 %
|
Change the "FL" and "fl" in the $tax_state
variables to the two letter postal code for your state.
Change the ".06" in the $tax_rate variable
to the current sales tax rate in your state. For
example, if your sales tax is 5.5%, you would edit the $tax_rate
variable to read: $tax_rate=".055";
2d. Specify the Shipping Charges you wish to use.
The Shopping Cart program can accommodate up to four types
of shipping charges that you specify. Each of these charges
is calculated using a simple base charge plus an additional
charge for each item ordered. The shipping section is located
at the end of the shop.cfg file as
shown below:
| # Set your shipping cost here
#
# set to "" to turn off shipping
# set to "" to turn off one kind of shipping
# values for shipping types
$shipping{1} = "upsground";
$shipping{2} = "upsred";
$shipping{3} = "upsblue";
$shipping{4} = "international";
# labels for shipping types
$shipping_label{$shipping{1}} = "US Mail";
$shipping_label{$shipping{2}} = "UPS Red";
$shipping_label{$shipping{3}} = "UPS Blue";
$shipping_label{$shipping{4}} = "International";
# descriptions for shipping types
$shipping_desc{1} = "Regular US Mail";
$shipping_desc{2} = "Delivery in 2 business days";
$shipping_desc{3} = "Next Day Delivery";
$shipping_desc{4} = "International Delivery";
# default shipping type
$shipby = "";
|
|
If you only want 2 shipping types:
$shipping{1} = "upsground";
$shipping{2} = "upsred";
$shipping{3} = "";
$shipping{4} = "";
These appear on the order email
Change these to whatever you
want your ordering department
to see on the form as the
shipping type
These are the choices the
customer sees on the order page.
Change these to whatever you
want the customer to see as the
shipping types
Use one of the shipping 'values'
$shipby = "upsground";
|
The actual shipping 'base' and 'rate' charges are
specified at the end of the shop.cfg
file as shown below:
| $shipping_base{$shipping{1}} = "6.51";
$shipping_rate{$shipping{1}} = ".49";
$shipping_base{$shipping{2}} = "18.31";
$shipping_rate{$shipping{2}} = ".69";
$shipping_base{$shipping{3}} = "8.66";
$shipping_rate{$shipping{3}} = ".59";
$shipping_base{$shipping{4}} = "100.00";
$shipping_rate{$shipping{4}} = "50.00";
|
The first two lines determine the first set of shipping
charges, the second pair of lines determine the second set of
shipping charges, and so on. You only need to change the
dollar amounts within the quotes for each pair of base and
rate shipping charges. Use the following examples as a guide
to setting the shipping charges.
Single charge of $10.00 for total order:
| $shipping_base{$shipping{1}} = "10.00";
$shipping_rate{$shipping{1}} = "0.00";
|
Flat rate of $5.00 per item:
| $shipping_base{$shipping{2}} = "0.00";
$shipping_rate{$shipping{2}} = "5.00";
|
$5.00 base charge plus an additional $2.50 per
item:
| $shipping_base{$shipping{3}} = "5.00";
$shipping_rate{$shipping{3}} = "2.50";
|
$15.00 for first item plus $4.00 for each
additional item:
| $shipping_base{$shipping{4}} = "11.00";
$shipping_rate{$shipping{4}} = "4.00";
|
The last example is a little tricky. The first item would
be charged $11.00 plus 1 x $4.00 = $15.00. Each additional
item would add an additional $4.00 to the shipping charge.
Note: this program cannot calculate shipping charges based
on weight, type of item, zone, country, or shipping tables.
2e. Upload the Configuration File
After you have finished making the necessary changes to
your configuration file and have saved it as a plain text
file, use your FTP program to upload
this file (shop.cfg) back up to
your /cgi-local directory.
*** Be sure you keep the file name shop.cfg
when you save your changes.
*** Be sure to upload the shop.cfg
file in ASCII transfer mode (not binary mode).
3. Create
your product list
The product list contains order information about each
item you wish to make available through the Shopping Cart
program. The Shopping Cart Generator creates a sample product
list file named product_list.txt
which is used in conjunction with the demo. You may
modify this existing product list file (found within the /shop
directory) or create your own, but make sure you keep the
name product_list.txt. You can use
a plain text editor (Notepad, WordPad, Teachtext, etc.) to
create or modify this file (be sure to save as plain text).
The product list contains one line of information for each
product you sell. Each line contains 4 specific sections of
information that the Shopping Cart program needs to create
the order. A pipe symbol " | " (hold shift and hit
the key below the Backspace/Delete key) is used to separate
each of these 4 sections of information. Therefore, make sure
you do not use this symbol in any of your descriptions; use
it only to separate the 4 categories.
Item ID Product Description
| |
| Product Number | Price
| | | |
| 1|AX-65000|Conner CS2000DATi 2.0GB SCSI-2 Int|1312.00|
2|AX-65001|Conner 2-4GB Turbo DAT,SCSI,5.25 Int|913.00|
3|AX-65002|Conner TSM4000R-SBE 4GB Int. SCSI|543.00|
|
Item ID
This is a unique ID number used to reference each
item in your list. It is usually numbered in ascending order
beginning with the number 1, as in the example. You will use
this ID number to reference your products in your web pages.
Product Number
Your internal item or product number associated with
the item. This product number will be listed on the order
form for each product the customer orders and is used for
your reference.
Product Description
This is the description of the product that you want
printed on the order form. This is not the description
that you put on your web pages to describe your products.
This description only appears on the order form, between the
product number and the price, for each product the customer
orders.
Price
The price of a line item to two decimal places (e.g.
13.00 or 7.98). You must include the cents; if the product
costs an even dollar amount include .00 to the end of the
price for the cents. This price only appears on the order
form and is used to calculate the total of the order. If you
change your prices, make sure you update your prices in your
web pages as well as in this product list file.
*** Be sure to download and upload
the product list file in ASCII transfer mode only.
*** If you choose to rename the product list file you MUST
also do so within the config file.
4. Modify
Your Web Pages to Include the Shopping Cart Features
One of the nice features of the Shopping Cart program is that
you can develop the structure and look of your web pages any way
that you want. You are only limited by your imagination. You can
list all your products on one page, or you can create a dozen
pages for each product. It's all up to you. There are just a few
additional steps needed to add the Shopping Cart functionality to
your web site.
*** All of your pages must reside
within the /shop/ directory.
4a. Create an Entry Page.
A shopping cart program can only work if it can keep track
of a particular customer as that customer travels through a
site. The Shopping Cart program uses a computer generated
Shopper ID (SID), to keep track of each customer that visits
your web site and what products that customer has added to
his or her shopping cart. You will need to create an Entry
Page that will give the Shopping Cart script a
chance to generate a unique Shopper ID for each customer
before the customers reach any pages from which they might
add or view products in their shopping cart. Customers must
go to this Entry Page before going to
any pages that implement the shopping cart functionality
(i.e. any of your product pages).
Your Entry Page can look however you want
it to look, but it must contain a special link that will
transport the customer into your site while at the same time
telling the Shopping Cart script to generate a unique Shopper
ID (SID) for the customer. This link will look similar to the
following:
| <a href="/cgi-local/shop.pl/page=list.html">
Browse through our Product Catalog!</a>
|
This link tells the Shopping Cart program (shop.pl) to
transport the customer to "list.html", but first
generate a new unique Shopper ID for the customer and hide it
within the hyperlinks of the "list.html" page. You
can refer the customer to any page that you want; you do not
need to use "list.html".
Many people create Entry Pages that tell visitors to
download the latest version of Netscape or Explorer, or that
give visitors the choice of a high graphic version or text
only version of the site, or that just present visitors with
an introductory splash screen that introduces the site. You
could even create a blank Entry Page that merely redirects
users to the above URL using a META tag redirect.
4b. Modify your hyperlinks to include the Shopper ID
(SID).
You must add a Shopper ID (SID) tag to every
internal hyperlink in every page of your web site that a
customer may traverse. When a customer visits one of your
pages, the Shopping Cart script will replace this Shopper ID
(SID) tag with the customer's unique Shopper ID that was
generated from the Entry Page.
You cannot add the SID tag to any external hyperlinks
(links to other sites), because other sites won't even know
what an SID is. Keep in mind, though, that if a customer
clicks on any hyperlink that does not contain an SID,
the Shopping Cart program will lose track of that customer
and not know what items the customer has in his or her
shopping cart, unless the customer hits the back button on
the browser to go back to a previous page in your site that
the customer had already visited. This means that you can add
links to your pages that go to other sites (for product
details, etc.), but only if you are certain that the customer
will 'back up' to a previously visited product page that
contains the customer's Shopper ID in the page's hyperlinks.
To add the Shopper ID (SID) tag to your links, modify your
links a shown below:
Change all your hyperlinks from this format:
| <a href="product2.html">Go to Next Page</a>
|
to this format:
| <a href="/cgi-local/shop.pl/page=product2.html /SID=PUT_SID_HERE">
Go to Next Page</a>
|
The two parts of the URL above that are new (the /cgi-local/shop.pl/page= and /SID=PUT_SID_HERE) will be exactly
the same for every link in your web pages and must be
typed exactly as shown.
If you are curious...
The above URL tells the shop.pl
program, which is located in your /cgi-local/ directory,
to show the file nextpage.html to the user,
but first replace all occurrences of PUT_SID_HERE
with whatever Shopper ID the user currently
has. In other words, this URL says, "transport the user
to nextpage.html, but remember the user's name so you can
keep track of what the user added to his or her shopping
cart."
4c. Create an 'add this item to your shopping cart'
link for each product in your site.
In order for a shopping cart is to be useful, customers
need to be able to add items to their shopping carts as they
browse your web site. You will need to add a link next to
each product you sell that allows customers to add that
particular product to their shopping carts. Your link to add
an item to the shopping cart should look similar to the
following:
| <a href="/cgi-local/shop.pl/page=shop.html /SID=PUT_SID_HERE/buy=1/item=3">
Add this item to your shopping cart.</a>
|
The only parts of this link that you should change are the
"page=shop.html" and
the "item=3", and, of
course, the text (or image) you wish to use as the hyperlink.
page=shop.html
This signifies to which page you wish to send the customer
when the customer clicks on the link. Most often you would
send the customer to your order form page so the customer can
see the details of the item added to the shopping cart, as
well as make any changes to the order (i.e. change the
quantity). You do not need to call your order form page
'shop.html'; you can call it 'orderform.html' or
'shopping_cart.html' or whatever you want.
item=3
This signifies which Item ID to look up in
the product list file (product_list.txt).
Remember that you assigned a unique Item ID
to each product you wish to sell and listed those products in
the text file product_list.txt. The
Shopping Cart program uses this Item ID to
determine which line in the product list file contains the
product number, description, and price for the product the
customer wishes to add to the shopping cart. It then
transfers this information to the shopping cart order form to
create a list of items the customer wishes to purchase.
4d. Create a "Shopping Cart" page.
You will need to create a "Shopping Cart" page.
This page shows a list of items the customer has added to his
or her personal shopping cart, the shipping methods, and the
total charges for the order. It also allows the customer to
change the quantity desired of any particular item, change
the shipping type, recalculate the total, or proceed to
checkout. You may design your page however you want, except
for the personalized order information which is generated by
the Shopping Cart script. Use the shopping cart page in the
demo (shop.html) as a guide for
creating your own page. (You can name your page anything you
want.)
To add the Shopping Cart information to your page, just
include the following tag in your file at
the location you want it to appear on the page:
You can see from the demo shopping cart page (shop.html)
that the Shopping Cart script generates the part of the page
between the two horizontal rules merely by replacing the tag
"PUT_SHOPPING_LIST_HERE" with the personalized
shopping cart information.
In order to allow customers to change their order
(quantity or shipping type), you will need to enclose the
page inside a FORM with the following action:
| <FORM method="POST"
ACTION="/cgi-local/shop.pl/page=shop.html /SID=PUT_SID_HERE/recalculate=1">
|
The recalculate=1 tells the
script to recalculate the order according to the changes the
customer made to the order form. Remember to change the shop.html to the name of your Shopping
Cart page. Also remember the closing FORM tag ( </form>
) as well as a submit button that says Recalculate.
4e. Create a "Billing Information" page.
You will also need to create a "Billing
Information" page. This page gives a form where the
customer can complete his or her order by filling in his or
her name, phone, shipping address, billing address, and
payment info. In order to create this page, you should just
modify the demo page email.html
because all of the form fields need to be exactly as in the
demo page. You cannot add any additional fields to the
form. You can format the page to your liking, but do not
change any of the form fields. Also, make sure the page
contains the following form action:
| <FORM METHOD="POST"
ACTION="/cgi-local/shop.pl/page=done.html /SID=PUT_SID_HERE/mail=1">
|
The mail=1 tells the script
to mail the order and billing information. Remember that the page= part of the URL tells the
Shopping Cart script to which page to send the customer next.
In this case, the demo page done.html
is a thank you page. You may send the customer to any page
you desire, although it is best to present the customer with
a new page that confirms that the order was sent and says
thank you for ordering.
You will link to the 'Billing Information' page by adding
a link on your 'Shopping Cart' page that is similar to the
following:
| <a href="/cgi-local/shop.pl/page=email.html /SID=PUT_SID_HERE">
Checkout</a>
|
Sending Information Securely
You can use our SSL Secure Server in conjunction
with this 'Billing Information' page to securely send
confidential order information from the user to the server.
This 'Billing Information' page is the only shopping cart
page that needs to be used with the SSL, since it is the only
page with confidential information.
To use SSL, modify your link to the 'Billing Information'
page as follows:
| <a href="https://wwwXX.rapidsite.net/userid/cgi-local/
shop.pl/page=email.html /SID=PUT_SID_HERE">Checkout</a>
*Do not break your URL onto 2 lines as shown. We did
only because it was too long to fit on the screen.
|
You also need to modify the FORM action on the 'Billing
Information' page as follows:
| <FORM METHOD="POST" ACTION="https://wwwXX.rapidsite.net/userid/
cgi-local/shop.pl/page=done.html/
SID=PUT_SID_HERE/mail=1">
*Do not break your URL onto 2 lines as shown. We did
only because it was too long to fit on the screen.
|
https://wwwXX.rapidsite.net/userid*
The 's' at the end of 'https' tells the browser that the link
points to a page that should be treated securely. You should
replace the 'userid' with your
userid and the 'XX' with the
number of the server on which your account resides. You can
find this information via your control panel under "Edit
Account Information".
*If you have obtained your own SSL certificate through
Verisign for your domain you can use your domain name
(https://www.yourdomain.com/) in place of the RapidSite
domain (https://wwwXX.rapidsite.net/userid/).
The End