Product Page

Understanding the attributes needed to capture products into the cart.

Please note that this document is still Work in Progress. It might be updated, revised, or changed entirely in the near future.

All attribute names will start with data-pc for the "Name" inside the Webflow Designer

Value	Description	Required
product-name	Product name
product-price	Product price
product-quantity	Captures the quantity
product-sku	Product SKU
add-to-cart-form	Define form element to capture data to bag
add-to-cart	Define button that triggers submit action
product-image	Product image
tax-type	Define product tax type (Product or Service)
custom-product-attribute	Captures custom attributes
variants-collection-container	Parent element that is hidden on live link
variant	Identify collection item
product-variant-select-1	Captures variant selector 1
product-variant-select-2	Captures variant selector 2
variant-1-name	Variant 1 product name
variant-2-name	Variant 2 product name
variant-price	Variant product price
variant-sku	Variant product SKU
variant-inventory	Variant product inventory
variant-image	Variant product image

Penni Cart Attributes

• add-to-cart-form needs to be placed on Webflow's Form element not Form Block

• Penni Cart currently supports two default values for tax-type, Product & Service that can used within Webflow CMS Collection settings.

• To display variants you'll need to establish the values that will auto-populate a select field, using variant to set your collection item and establishing values with variant-1-name or variant-2-name, variant-price, variant-sku, variant-inventory, and variant-image.

• Use variants-collection-container to hide the parent wrapper when viewing your site's published link.

• product-variant-select-1 & product-variant-select-2 uses the select field's name as the label when added to cart.