How to customize Shop pages by using Elementor? [Update WooBuilder]

The shop archive page and product single page are the default WooCommerce template. Therefore, it’s very limited to customize the layout of these pages. Luckily, we can totally edit the Shop page with the WooCommerce elementor.

What’s the Elementor Theme Builder?

Theme Builder is an advanced function of Elementor Pro. This feature helps visually customize headers, footers, archive pages, single post pages, and other shop pages. Basically, you can build these pages by using the Elementor page builder.

Does Elementor work with WooCommerce in Woostify?

Woostify was intergraded with the Elementor API of Theme builder function. Therefore, you can use Elementor to build any parts of the site when using Woostify theme.

Below is how we can use Elementor to customize elementor product page:

Step 1: To build a product single page, you can go to Templates -> Theme builder -> Add new and select Product single template


Step 2: Just drag and drop widget to build this page


Note: Product image widget default doesn’t work. You must choose Woostify – Product images widget that requires Elementor bundle add-on of Woostify Pro


For this tutorial, you will use the following widgets:

  • Product Title widget
  • Woo Breadcrumbs widget
  • Woostify – Product image widget
  • Product rating widget
  • Short description widget
  • Product price widget
  • Add to cart widget
  • Product meta widget
  • Product data tabs
  • Product related 
  • Upsells widget

Step 3: Click to Publish button and set the condition where you want to apply this page. You can set it for all product pages or by category and tag.


If you want to build a custom product archive page, you only need to create a new page and set it for the Product Archive template and follow all the steps above.

With this feature, you can build the shop page visually without any coding knowledge. This feature helps save a ton of time and brings flexibility to build a fully-functional online store.

Update: Above is the way to customize the Shop page with Elementor Pro. Now with Woostify, you don’t need to get Elementor Pro to build your shop pages. Woostify has released WooBuilder which is a great and unique feature allowing users to create their desired shop page, single product page, cart page, and checkout page. This feature is built with the aim to increase conversion rates, which has a big contribution to your store’s sale enhancement.

Leave a Reply

Notify of

Download Woostify Now

Enter your email address and be the first to learn about updates and new features.

stay informed!

Subscribe to receive exclusive content and notifications