Working With the Add to Cart Web Part
The Add to Cart Web Part adds the product currently displayed to the shopping cart. The Add to Cart Web Part appears alongside either the Simple Property List Web Part or the Product Details Web Part on a product details page. In addition, the Add to Cart Web Part can provide an option to add the current product to an existing or new shopper list.
If there are variants for the product that is being added, the Add to Cart Web Part provides a drop-down list of the variants. The Add to Cart Web Part can also be configured to allow a quantity field to be displayed for shopper entry. Also, the Add to Cart Web Part can determine if the product selected is out of stock, and if so, display a message to that effect to the shopper, as well as disabling the Add to Cart button.
Web Part
The following figure shows the Add to Cart Web Part.
.gif "Dd451872.vugAddToCartWebPart(en-US,CS.90).gif") |
Adding the Web Part to a Page
When first added, the Add to Cart Web Part will display an error message:
.gif "Dd451872.vugaddtocartwebpartscreen1(en-US,CS.90).gif")
This message is displayed because the Add to Cart Web Part needs to be connected to a product provider to function. To associate the Add to Cart Web Part with an existing product provider, use the edit option on the Web Part, select Connections, select Get Product Provider From, and then select the Product Provider Web Part. The Product Provider Web Part must be set to include variants for this to function correctly.
Property Sheet
The following figure shows the Add to Cart Web Part property sheet. The Add to Cart Web Part property sheet lets site designers control some aspects of the Web Part's behavior and appearance. The property sheet is displayed by selecting the edit option on the Web Page (in Edit Page mode) and then selecting Modify Shared Web Part. This displays the property sheet. Expand the sections to see the relevant properties.
.gif "Dd451872.Vug_AddToCart_WP_Properties(en-US,CS.90).gif")
Properties
The following table lists and describes the properties available on the Add to Cart Web Part property sheet.
Property |
Type |
Description |
Default |
|---|---|---|---|
Display "quantity" input box |
Boolean |
If checked, a text box is displayed that lets the user type in the quantity that will be added to the cart when the "add to cart" button is pressed. If unchecked, the text box will not be displayed and adding to cart will always add a single item. |
True |
Display "add to list" button |
Boolean |
If checked, an "Add to list" button is displayed. |
True |
"Add to list" adds to default list |
Boolean |
If checked, the "Add to list" button adds the item directly to the default list. If unchecked, a pop-up is displayed allowing the user to select the desired list to add the item to. |
False |
Variant list item display format |
String |
Sets the "String.Format"-compatible format string used to display each product picker item. Default is "{0} - ${1:#.00}", where {0} represents the display name and {1} represents the price (default value uses additional formatting instructions). Note that the product properties used for display name and price are configured using other settings on this Web Part. |
{0} - ${1:#.00} |
Layout : Horizontal alignment |
Enum |
Sets the horizontal alignment to use when displaying this web part. |
Left |
"Add to cart" button label |
String |
Sets the text displayed on the "add to cart" button. |
Add To Cart |
"Add to list" button text |
String |
Sets the text displayed on the "Add to list" button. |
Add To Wish List |
"Out of stock" message |
String |
Message displayed when adding a product that is out of stock. |
Product is out of stock. |
Commerce "Basket" to use |
String |
Sets the name of the Commerce Foundation "Basket" that this Web Part will add items to. The default and recommended values are empty, indicating the default Basket. |
Blank |
Product property used as display name |
String |
Name of the property associated with the product in the Commerce Server 2009 catalog to use as the display name in the selection picker. |
DisplayName |
Product property used as price |
String |
Name of the property associated with the price entry in the Commerce Server 2009 catalog to use as the price in the selection picker. |
ListPrice |