If you have an existing website there are various ways of adding shopping cart functionality to the site without having to completely redesign the site or move it to a new ecommerce package.
In this tutorial we will look at adding a simple HTML shopping cart to a website using PayPal.
What Does a Shopping Cart Do- The Basics
Basically a shopping cart allows you to select and de-select items to purchase, and once you have finished, to then go ahead and purchase them.
You display details of your products, and with each product you add a button that says ‘add to basket’ (or similar).
If your customer wants to buy the product all they need to do is press the ‘add to basket’
button.
What this does is create a list of things being purchased.
The customer can view the list at any time to see what they are purchasing, and how much they have spent.
They can also add/remove items at any time.
When finished they click another button to actually make the purchase (often labelled ‘go to checkout’).
They can also do much more than that. They can:
- Send emails
- Add taxes
- Calculate postage
- add shipping costs
- accept coupons
- etc
Because of this they can range in complexity from simple HTML forms to sophisticated programs (usually written in php).
Quick and Easy HTML Shopping Cart Using PayPal
Shopping carts need to be integrated into some form of payment system so they can accept payments.
PayPal is a payment provider and provides the ability to create a free HTML shopping cart as part of the payment system.
It is by far the easiest and quickest way of adding a shopping cart to your existing site.
To start, all you need is to sign up for a free PayPal account (which only requires an email address). Then you:
- Log in to your PayPal account.
- Click on the Tools tab
The shopping cart is an option of the buy now buttons.
Scroll down to the PayPal Buttons box and click on the heart to add it to the tools menu for easier access.
Click anywhere in the box or click the open link. You are taken to your existing saved buttons if you have them.
You can edit these buttons,get the HTML code and use them to create a new button.
On the far right of this screen you will see the option to create a new button.
Creating a new button consists of three steps.
- Step 1– Choosing button and entering button details
- Step 2- Inventory tracking -optional and for advanced users- not covered here
- Step 3– Checkout, Delivery details and download links- Option but almost always required.
If you click the create new button link The first step of the create button form is displayed and you should see a screen similar to that shown below.
Edit the option fields and add/remove options.
This what my completed cart looks like
Now we need to fill out postage (if any) and then move to section 3 which deal with delivery options.
Also use the secure merchant ID option (default) as it stops anyone seeing your email address.
Step 2
is not normally needed and I wont cover it here.
Step 3
If you are selling physical goods then you will need a delivery address.
If you are selling digital goods then you will need to direct them to the download page
The advanced variables aren’t required. Click create button when done and you will be taken to the code page were you can get the HTML code that you will use on your web page.
Simple Testing and Editing
Copy the code into notepad save on you computer as paypal.htm (the extension is important)
You can now open this in a web browser and it should work just as it would on a web page.
If you are comfortable with HTML and CSS and want to customise the Look and feel of the button then You can modify the form by adding your own HTML and styles.
However there are certain parts of the form that you cannot change shown in yellow in the image below:
Once you are happy then copy this code to your web page.
Website Requirements and Suitability
This method adds an HTML shopping cart, so your site doesn’t need to supporting scripting like php.
In addition you don’t need a merchant account as everything is done using your PayPal account.
The transaction is secure as it is processed by PayPal, and your site doesn’t need encryption.
The method can be used for as many items/products as you want but is ideally suited for sites selling a small number of products due to the basic product management features.
Common Questions and Answers
Q- Will it Work with WordPress?
A- Yes- You can also get simple plugins that make it easier
Q- Can I create multiple carts?
A- Yes
Resources:
I created a Video some time ago and although the PayPal interface has changed since then you should still find it useful
Please don’t forget to leave a comment
Related Articles
