You are here: The ProductCart Encyclopedia » How To's » Adding a product to the cart from anywhere
Adding a product to the cart from anywhere
It's easy to add a product to your ProductCart-powered shopping cart from any page (or even an email).
Using a link
The code is extremely simple and can be used anywhere you can use an HTML link.
- First, log into the Control Panel (or visit the product details page) and note down the product ID. This is not the SKU (part number), but rather the ID of the product in the database. It's shown in the querystring (browser address field) when you load a product details page in both the storefront and the Control Panel.
- Use the product ID in your link. For example, here is a link that adds “ProductCart” to the shopping cart on our Early Impact software store. The code looks as follows:
<a href="http://www.earlyimpact.com/eistore/productcart/pc/instPrd.asp?idproduct=431">Add to Cart</a>
- Replace the URL to the instPrd.asp page with the one that applies to your store
- Replace the number that follows idproduct= with the ID of the product that you are trying to add
Using a form
You can do the same with a form, which also allows you to specify the quantity to be added to the cart. The form could reside on any page, static or dynamic.
<form name="myForm" method="post" action="http://www.earlyimpact.com/eistore/productcart/pc/instPrd.asp"> <input type="text" name="quantity" value="1" size="2" maxlength="2"> <input type="hidden" name="idproduct" value="431"> <input type="submit" name="Submit" value="Add to cart"> </form>
- Replace the URL in the form action with the one that applies to your store
- Replace the number in the idproduct= hidden field with the ID of the product that you are trying to add
- If you don't want to show a quantity, you can make that a hidden field too by changing the field type
Here is how this basic form would look:
Adding multiple products to the cart
ProductCart has the ability to add multiple items to the cart at the same time (there is a category display setting that allows for this, as you know). Therefore, adding multiple products to the cart at the same time from another page can certainly be done, but it is a bit more difficult to do.
Here is the code associated with a form that can add to products to the shopping cart:
<form name="m" method="post" action="http://www.earlyimpact.com/eistore/productcart/pc/instPrd.asp" id="m"> <input name="idProduct1" type="hidden" value="431"> <input name="QtyM431" type="text" value="0" size="2" maxlength="10"> ProductCart <br /> <input name="BTOTOTAL1" type="hidden" value="695"> <input name="idProduct2" type="hidden" value="444"> <input name="QtyM444" type="text" value="0" size="2" maxlength="10"> eBay Add-on <br /> <input name="BTOTOTAL2" type="hidden" value="395"> <input type="hidden" name="pCnt" value="2"> <input type="submit" name="Submit" value="Add to cart"> </form>
Note the following:
- The hidden field pCnt (at the bottom) tells ProductCart how many items are in the form
- You need to have, for each product in the form:
- An idProductN field, where N is the integer for each product, starting with 1 for the first product
- The value in that hidden field is the product ID, as described earlier in this article
- The QtyM field name contains the product ID after the string “QtyM”
- The BTOTOTALN hidden field (where N changes as for idProductN - see above) contains the product price
Here is how this basic form would look on an HTML page:
Adding an Apparel Sub-Product to the cart
For users of the Apparel Add-on: as you know, an Apparel product is made of a parent product and a series of “sub-products”. If you want to add a specific sub-product to the cart, you need tell ProductCart that what you are passing to the system is indeed the ID of a sub-product.
Here is a working example from one of our demo stores:
http://www.earlyimpact.com/demos/apparel/pc/instprd.asp?idproduct=1226&apparel=1
Note the parameter “apparel=1” in the string.
You can find out the ID of a sub-product by using this simple trick:
- Go to the product details page in the storefront
- Use the “Choose and add another” feature
- Mouse over the 'Remove' icon: the status bar in your browser shows you the ID of the sub-product