Woo Add to cart module

The Add to cart module is the module responsible for displaying the “cart form” on product pages. The output of the module depends on the product type.

If the product is a simple product, it will display:

1. Stock status.
2. The quantity field.
3. The “add to cart” button.

If the product is a variable product, it will display:

1. The variations/options drop-down menus.
2. The price of the selected variation.
3. The description of the selected variation.
4. The quantity field.
5. Stock status.
6. The “add to cart” button.

If the product is a grouped product, it will display:

1. A list of all the grouped products.
2. The price of each product.
3. A quantity field for each product.
4. The “add to cart” button.

If you are using a 3rd party plugin that adds custom product types like the WooCommerce Bookings, WooCommerce Add-ons or WooCommerce Composite, the module will display the additional 3rd party fields without any issues.

Also, keep in mind that a lot of other 3rd party plugins may depend on the “summary hook” which means you will need to use the “Woo Product Summary” module to display their custom cart form because the add to cart module will not work.

Content options

– Button Text

Here you can add a custom text for the add to cart button. By default, the text is “Add to cart”, you can change that to anything you like.

– Show Quantity Input

You can display or remove the quantity field if you don’t need it, it is helpful if you don’t allow buying the same item more than once.

– Hide variation price

If the product is a variable product when the user selects a specific variation, the module will display the price of this variation, you can disable that.

Design options

– Quantity text

Here you control the font ( family, size, style, color… ) of the quantity field.

– Variation description text

Here you control the font ( family, size, style, color… ) of the variation description if the product is a variable product.

– Variation price text

Here you control the font ( family, size, style, color… ) of the variation price if the product is a variable product.

– Variations labels text

Here you control the font ( family, size, style, color… ) of the variation label ( the name of the drop-down menu ) if the product is a variable product.

– In Stock text

Here you control the font ( family, size, style, color… ) of the stock status if the product is in stock.

– Out of stock text

Here you control the font ( family, size, style, color… ) of the stock status if the product is out of stock.

– Button

Here you can customize the look and everything related to the add to cart button; the font, the color, the background, the icon, and every option has its own setting on hover as well.

Important notes

• Like any other product module, the module works on product pages only. If you add it to a “post or page” or any other post type, it will not output anything. Only product layouts.

• On the visual builder, the module displays dummy data like variations drop-down menus, stock status, dummy prices… for demonstration only so you can see how things will look in the actual page.

• Some 3rd party plugins need this module to display their custom data like request quote plugins, bookings… or any plugin that attach specific data to the cart form.

• You may also consider using the “Woo Product Summary” module to display these 3rd party data if the “add to cart” module didn’t display them.