---
title: "How to Edit WooCommerce Checkout Page in Elementor?"
url: https://theplusaddons.com/docs/edit-woocommerce-checkout-page-in-elementor/
date: 2023-12-07
modified: 2026-04-10
lang: en
author: "Aditya Sharma"
description: "Are you looking to edit the WooCommerce checkout page in Elementor to match your brand and style? However, customizing the default WooCommerce checkout page will require coding knowledge. But with..."
image: https://theplusaddons.com/wp-content/uploads/2023/12/How-to-Edit-WooCommerce-Checkout-Page-in-Elementor_-1024x536.jpg
word_count: 262
---

# How to Edit WooCommerce Checkout Page in Elementor?

## 

- Customize the WooCommerce checkout page using the Woo Checkout widget from The Plus Addons for Elementor without coding.
- Activate the Woo Checkout widget by navigating to The Plus Addons u2192 Widgets and turning on the toggle for the widget.
- Edit the checkout page in Elementor by adding the Woo Checkout widget and selecting styles from the Layout tab and icons from the Extra Options tab.

Are you looking to edit the WooCommerce checkout page in Elementor to match your brand and style? However, customizing the default WooCommerce checkout page will require coding knowledge.

But with the Woo Checkout widget from The Plus Addons for Elementor you can easily customize the WooCommerce checkout page 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 Checkout widget is activated, to verify this visit The Plus Addons → Widgets → and Search for Woo Checkout and activate.

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

## How to Activate the Woo Checkout 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-checkout-activation.png)

## Add Woo Checkout

To edit the checkout page, open the checkout page with Elementor and add the Woo Checkout widget.

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

From the **Style** section, under the **Layout** tab, you can select from two predefined styles.

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

Suggested reading, [5 best WooCommerce Elementor themes with detailed comparison](https://theplusaddons.com/blog/best-woocommerce-elementor-themes/)

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

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

Now, you’ll see a beautiful checkout form.

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

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