How to Add Products to Cart & Quote in Magento 2
Magento 2 comes with four default types of products:
- Simple product
- Downloadable product
- Configurable product
- Bundle product
In this article, I will instruct you to add four types of products (including a simple product, a downloadable product, configurable product, and a bundle product) to the cart. On behalf of a customer, all calls are performed, and the customer’s token is specified in the authorization header. Let’s explore the process together!
- How To Add A Simple Product To A Cart
- How To Add A Downloadable Product To A Cart
- How To Add A Configurable Product To A Cart
- How To Add A Bundle Product To A Cart
How To Add A Simple Product To A Cart
To add a simple product to a cart, you are required to specify a SKU, the quantity, and the quote ID, which was generated when the cart was created.
In this post, we take an example of adding an orange medium-sized Radiant women’s t-shirt (SKU: WS12-M-Orange) to the cart.
Endpoint
POST <host>/rest/<store_code>/V1/carts/mine/items
Headers
Content-Type application/json
Authorization Bearer <customer token>
Payload
{
"cartItem": {
"sku": "WS12-M-Orange",
"qty": 1,
"quote_id": "4"
}
}
Response
{
"item_id": 7,
"sku": "WS12-M-Orange",
"qty": 1,
"name": "Radiant Tee-M-Orange",
"product_type": "simple",
"quote_id": "4"
}
How To Add A Downloadable Product To A Cart
To add a downloadable product to a cart, you muust provide the SKU, the quantity, and quote ID.
In our example, we will add the downloadable product Advanced Pilates and Yoga (SKU: 240-LV08).
Endpoint
POST <host>/rest/<store_code>/V1/carts/mine/items
Headers
Content-Type application/json
Authorization Bearer <customer token>
Payload
{
"cartItem": {
"sku": "240-LV08",
"qty": 1,
"quote_id": "4"
}
}
Response
{
"item_id": 8,
"sku": "240-LV08",
"qty": 1,
"name": "Advanced Pilates & Yoga (Strength)",
"price": 18,
"product_type": "downloadable",
"quote_id": "4",
"product_option": {
"extension_attributes": {
"downloadable_option": {
"downloadable_links": [
5
]
}
}
}
}
How To Add A Configurable Product To A Cart
To add a configurable product to a cart, you need to provide the SKU as well as the set of option_id/option_value
pairs which make the product configurable.
The following example, add the Chaz Kangeroo Hoodie (SKU: mh01) configurable product to the cart.
This product offers three colors (black, gray, and orange) and fives sizes (XS, S, M. L. XL).
In the sample data, the option_id
values for Size and Color are 141 and 93, respectively.
To get the option_id
values for the given SKU, you can use the GET /V1/configurable-products/:sku/options/all
.
The returned values of the GET /V1/configurable-products/:sku/children
call is each combination of color and size, 15 in all for MH01.
The below sample displays the returned values for size
and color
attribute of a small gray Chaz Kangeroo Hoodie.
{
"custom_attributes": [
{
"attribute_code": "size",
"value": "168"
},
{
"attribute_code": "color",
"value": "52"
}
]
}
Now you know the values for option_value
for size
and color
are 168 and 52, so it is time for you to add product to the cart.
Endpoint
POST <host>/rest/<store_code>/V1/carts/mine/items
Headers
Content-Type application/json
Authorization Bearer <customer token>
Payload
{
"cartItem": {
"sku": "MH01",
"qty": 1,
"quote_id": "4",
"product_option": {
"extension_attributes": {
"configurable_item_options": [
{
"option_id": "93",
"option_value": 52
},
{
"option_id": "141",
"option_value": 168
}
]
}
},
"extension_attributes": {}
}
}
Response
{
"item_id": 13,
"sku": "MH01-S-Gray",
"qty": 1,
"name": "Chaz Kangeroo Hoodie",
"price": 52,
"product_type": "configurable",
"quote_id": "4",
"product_option": {
"extension_attributes": {
"configurable_item_options": [
{
"option_id": "93",
"option_value": 52
},
{
"option_id": "141",
"option_value": 168
}
]
}
}
}
How To Add A Bundle Product To A Cart
The Sprite Yoga Companion Kit (SKU: 24-WG080
) is a bundle product which is provided by the sample data. There are many items included in the kit, as follows:
- Sprite Statis Ball in sizes 55 cm (SKU:
24-WG081-blue
), 65 cm (SKU:24-WG082-blue
), or 75 cm (SKU:24-WG083-blue
) - Sprite Foam Yoga brick (SKU:
24-WG084
) - Sprite Yoga Strap in lengths 6 ft (SKU:
24-WG085
), 8 ft (SKU:24-WG086
), or 10 ft (SKU:24-WG087
) - Sprite Foam Roller (SKU:
24-WG088
)
The requirement for adding a bundle product to a cart is specifying the SKU of this bundle product, but not the individual items. To add individual items to the bundle product, you need to specify the ID defined in the item’s product_links
object.
The primary function of the product_links
object is describing the ordering and placement of options on the customization page.
Besides, it links an item’s SKU and ID to the SKU of the bundle product.
The returns of the GET <host>/rest/<store_code>/V1/bundle-products/24-WG080/options/all call
are id
values, as displayed in the below simplied response:
[
{
"option_id": 1,
"title": "Sprite Stasis Ball",
"required": true,
"type": "radio",
"position": 1,
"sku": "24-WG080",
"product_links": [
{
"id": "1",
"sku": "24-WG081-blue",
"option_id": 1,
"qty": 1
},
{
"id": "2",
"sku": "24-WG082-blue",
"option_id": 1,
"qty": 1
},
{
"id": "3",
"sku": "24-WG083-blue",
"option_id": 1,
"qty": 1
}
]
},
{
"option_id": 2,
"title": "Sprite Foam Yoga Brick",
"required": true,
"type": "radio",
"position": 2,
"sku": "24-WG080",
"product_links": [
{
"id": "4",
"sku": "24-WG084",
"option_id": 2,
"qty": 1
}
]
},
{
"option_id": 3,
"title": "Sprite Yoga Strap",
"required": true,
"type": "radio",
"position": 3,
"sku": "24-WG080",
"product_links": [
{
"id": "5",
"sku": "24-WG085",
"option_id": 3,
"qty": 1
},
{
"id": "6",
"sku": "24-WG086",
"option_id": 3,
"qty": 1
},
{
"id": "7",
"sku": "24-WG087",
"option_id": 3,
"qty": 1
}
]
},
{
"option_id": 4,
"title": "Sprite Foam Roller",
"required": true,
"type": "radio",
"position": 4,
"sku": "24-WG080",
"product_links": [
{
"id": "8",
"sku": "24-WG088",
"option_id": 4,
"qty": 1
}
]
}
]
In this example, we will configure the Sprite Yoga Companion Kit as follows:
- 65 cm Sprite Stasis Ball (id: 2)
- Sprite Foam Yoga Brick (id: 4)
- 8 ft Sprite Yoga strap (id: 6)
- Sprite Foam Roller (id: 8)
Endpoint
POST <host>/rest/<store_code>/V1/carts/mine/items
Headers
Content-Type application/json
Authorization Bearer <customer token>
Payload
{
"cartItem": {
"sku": "24-WG080",
"qty": "1",
"quote_id": "4",
"product_option": {
"extension_attributes": {
"bundle_options": [
{
"option_id": 1,
"option_qty": 1,
"option_selections": [2]
},
{
"option_id": 2,
"option_qty": 1,
"option_selections": [4]
},
{
"option_id": 3,
"option_qty": 1,
"option_selections": [6]
},
{
"option_id": 4,
"option_qty": 1,
"option_selections": [8]
}
]
}
}
}
}
Response
{
"item_id": 9,
"sku": "24-WG080-24-WG084-24-WG088-24-WG082-blue-24-WG086",
"qty": 1,
"name": "Sprite Yoga Companion Kit",
"price": 68,
"product_type": "bundle",
"quote_id": "4",
"product_option": {
"extension_attributes": {
"bundle_options": [
{
"option_id": 1,
"option_qty": 1,
"option_selections": [
2
]
},
{
"option_id": 2,
"option_qty": 1,
"option_selections": [
4
]
},
{
"option_id": 3,
"option_qty": 1,
"option_selections": [
6
]
},
{
"option_id": 4,
"option_qty": 1,
"option_selections": [
8
]
}
]
}
}
}
Verify The Result
- Sign in as the customer.
- Then, click on the shopping cart. Here you will see all the items you added.
Speed up your shopping experience with the add-to-cart pop-up function and AJAX loading
Check it out!Conclusions
Above are the detailed instructions for adding items to cart/ quote. Hopefully, this guide is useful for you! If you have any questions, feel free to leave a comment below! Thank you for reading!
- How to create a simple Hello World module for Magento 2
- Magento 2 Block Template Ultimate Guides
- How to Create Module in Magento 2
- How to Create Controller in Magento 2
- How to create CRUD Models in Magento 2
- How to Create Magento 2 Block, Layout and Templates
- Configuration - System.xml
- How To Create Admin Menu In Magento 2
- Admin ACL
- Admin Grid