---
title: "How to Edit WooCommerce Cart Page in Elementor?"
url: https://theplusaddons.com/docs/edit-woocommerce-cart-page-in-elementor/
date: 2023-12-07
modified: 2026-04-10
lang: en
author: "Aditya Sharma"
description: "Do you want to edit the WooCommerce cart page in Elementor? Similar to the other pages of WooCommerce, you’ll get very limited options to edit the cart page. So to..."
image: https://theplusaddons.com/wp-content/uploads/2023/12/How-to-Edit-WooCommerce-Cart-Page-in-Elementor_-1024x536.jpg
word_count: 564
---

# How to Edit WooCommerce Cart Page in Elementor?

## 

- Customizes the WooCommerce cart page using the Woo Cart widget from The Plus Addons for Elementor.
- Requires the PRO version of The Plus Addons for Elementor and Elementor FREE Plugin to activate the Woo Cart widget.
- Offers layout options including Default and Custom to manage sections like Cart Data, Cart Total, and Checkout Button.

Do you want to edit the WooCommerce cart page in Elementor? Similar to the other pages of WooCommerce, you’ll get very limited options to edit the cart page. So to edit the cart page you need coding knowledge.

With the Woo Cart widget from The Plus Addons for Elementor you can easily customize the WooCommerce cart page as per your style and brand without any coding.

*To check the complete feature overview documentation of The Plus Addons for Elementor Woo Builder, [click here](/docs/woo-builder-settings-overview/).*

## Required Setup

- [Elementor FREE Plugin](https://wordpress.org/plugins/elementor/) installed & activated.

- You need to have [The Plus Addons for Elementor](https://wordpress.org/plugins/the-plus-addons-for-elementor-page-builder/) plugin installed and activated.

- This is a Premium widget, and you need the [PRO version of The Plus Addons for Elementor](https://theplusaddons.com/pricing//?utm_source=tpae&utm_medium=docs&utm_campaign=text).

- Make sure the Woo Cart widget is activated, to verify this visit The Plus Addons → Widgets → and Search for Woo Cart and activate.

https://www.youtube.com/watch?v=zLBnX4lMhWU

## How to Activate the Woo Cart Widget?

Go to 

- **The Plus Addons **→** Widgets **

- **Search **the widget name** **and** turn on the toggle.**

![](https://theplusaddons.com/wp-content/uploads/2023/12/woo-cart-activation.png)

## Add Woo Cart

To edit the cart page, open the cart page with Elementor and add the Woo Cart widget.

> *Note: Make sure all the default WooCommerce pages are created.*

From the **Layout **dropdown, under the **Layout** tab, you have to select a layout. Here you’ll find two options - 

**Default** - To show all the default sections of the cart page.

**Custom** - With this option, you can customize which sections to show.

### Default

When you select the **Default** option from the **Layout** dropdown, you’ll get some customization options under the **Cart with Items** tab.

![woo cart default](https://theplusaddons.com/wp-content/uploads/2023/12/woo-cart-default.gif)

**Display Cart** - To show or hide the cart section with items.

**Display Cross Sell** - To show or hide the cross sell products.

**Hide Coupon Option** - To show or hide the coupon section.

**Display Cart Total** - To show or hide the cart total section.

**Full Width Cart Total** - To make the cart total section full width.

### Custom

When you select **Custom** from the **Layout** dropdown, you’ll see three items, open one item.

![woo cart custom](https://theplusaddons.com/wp-content/uploads/2023/12/woo-cart-custom.gif)

Learn, [how to edit WooCommerce thank you page in Elementor](https://theplusaddons.com/docs//edit-woocommerce-thank-you-page-in-elementor/).

From the **Select **dropdown, you have to select the section you want to show. Here, you’ll find three options -

**Cart Data** - To show the cart section with items. You can manage the section width for different devices.

**Cart Total** - To show the cart total section. You can manage the section width for different devices.

**Checkout Button** - To show the checkout button. You can manage the section width and the button text as well.

Similarly, you can edit the other items, and you can also drag and drop to rearrange the items or you can delete an item as well.

You can click on the **+ Add Item** to add more items.

From the **Empty Cart** tab, you can set a custom image/icon and message for the empty cart.

![woo cart empty cart](https://theplusaddons.com/wp-content/uploads/2023/12/woo-cart-empty-cart.gif)

Suggested reading, [Ultimate guide to protect WooCommerce store from fraud & fake orders [Tips+Tools]](https://theplusaddons.com/blog/protect-woocommerce-store-from-fraud-fake-orders/)

You can also hide the empty cart by enabling the **Hide Empty Cart** toggle.

Then, from the **Extra Options** tab, you can add icons to each button of the cart page by adding the [Font Awesome icon](https://fontawesome.com/v4/icons/) Unicode.

![woo cart extra options](https://theplusaddons.com/wp-content/uploads/2023/12/woo-cart-extra-options.png)

From the **Style** tab, you can customize the page style further.

Now, you’ll see a beautiful cart page.

![woo cart demo](https://theplusaddons.com/wp-content/uploads/2023/12/woo-cart-demo-1024x726.png)

Also, check [how to edit WooCommerce checkout page in elementor](https://theplusaddons.com/docs//edit-woocommerce-checkout-page-in-elementor/).