Table Of Contents

How to Use WC-Cart Page Widget

In the documentation below, I’m going to show you ‘How to Use WC-Cart Page Widget‘. To use the widget is super easy. What more, I will include some instructions with pictures detailed to help you to get it started.

To Insert Widget

inserting WC-Cart Page widget

To insert a widget into the section is a very fun thing. Simply, drag and drop the WooCommerce product cart widget you want to use for your project. As you see in the screenshot above.


Using the Content Tab, you’ll be able to make a layout of a particular part of a website. And in this regard, some handy sections in the tab will assist you a lot in designing the WC-Cart Page widget.

Now, I’m going to show the sections of the tab and how they work behind the widget.


After inserting the WC- Elements widget, go to Element > Element control > select Cart Page from the dropdown. Then, you’ll find your cart page. As you see in the image example above.

N.B: If you are to use Cart Page, first of all, you’ve to make sure you have listed the products in the WooCommerce. And to do that, just go to WordPress Dashboard > WooCommerce > Products. Keep your eyes on the image.

Style Tab

Now, let’s work with the Style Tab. The tab will easily have you style the web content (text, image, video, etc.) of the page you require to design the WooCommerce cart page. 

Styling with the tab in Elementor will always give you a fantastic experience.

Let’s have a look.

Table Heading

Here, this section will let you add color to both Text and Background. Simply, go to the Style tab > Table Heading.

Table Content

If you want to style the content of the cart page, then, go to the Style tab > Table Content. Take a look at the image.


Go to the Style tab > Input.

Under this section, you can beautify all the input contents. As you see in the image above.

Coupon/ Update Button

Here, you’ve to go to the Style tab > Coupon/ Update Button.

In general, you’ll be able to add a Border with different styles, Border Radius, Box Shadow, Padding, and Typography from this section.

Moreover, see there are two modes (Normal/ Hover) under the sub-heading Button Style and the modes will allow you to style the Coupon Button of the WC-Cart Page widget by Element Pack.

Checkout Button

Finally, look at the subheading Button Style. You should go to the Style tab > Checkout Button and you’ll be able to style under the modes both Normal and Hover.

Video Assist

To sum up, if the doc described above is not enough, I’ll say.
Go and watch the video on ” How to Use WooCommerce Cart Page” inserted. And to get knowledge about the widget by Element Pack go for the demo page.

Enjoy New Year 2022 with a 35% Discount on all Products! Check Here


Don’t worry we hate spam and we promise you will get only quality news and offer from us.

© Copyright 2021 All Rights Reserved by BdThemes