No databases, no programming, no headaches. A simple javascript shopping
cart in under 17kb that you can setup in minutes. It's lightweight, fast,
simple to use, and completely customizable. All you need to know is basic HTML.
-
QUICK START GUIDE
-
version 2.2.2: this is the last stable of release of v2.2 that uses cookies.
After downloading the files, simply place a copy of the simpleCart.js in your site directory, and attach it to each page that will be using the cart:
1.<script type="text/javascript" src="simpleCart.js"></script>
PayPal is the default checkout option. So if you have a Paypal account, you will need to set your account email:
1.<script type="text/javascript"> 2. simpleCart.email = "you@yours.com"; 3.</script>
To have an item for sale (like an awesome t-shirt), you can put it on your "Shelf" like so:
1.
To create a shelf item, you create a div with a class of “simpleCart_shelfItem”. Any field you want for your item can be set by creating a tag with a class of “item_field-name” and the contents or value of the tag will be the value added for the item. Please check out Shelf Setup for more info about the shelf.
You can also add an item to the cart with a simple link:
1.Add To Cart
If you want to display information about the cart anywhere on your page, simple create any tag (div, span, a, h2, …etc) with a specific class name.
For the total items in the cart, use “simpleCart_quantity”
1.You have items in your Cart.
For the cart total, use “simpleCart_total”
1.Cart total:
You can create a Checkout link or Empty Cart link by using "simpleCart_checkout" and "simpleCart_empty"
1.Checkout 2.Empty
The checkout link will immediately send all the items to PayPal (or another checkout option like Google Checkout) when you click it. These don't have to be links, however, you can also use a div, images, or any other tag by simply setting the class correctly.
You can display the full cart on any page by simply creating a div with a class of "simpleCart_items"
1.
SimpleCart(js) will automatically populate the div with all the items in the cart. You can change the appearance of your cart or what columns are in the cart by checking out Cart Header Formatting.
- For more information, please go to simplecartjs.com