help center

On this page

Create a single product template for WooCommerce

Last Update: January 14, 2024

With  Elementor WooCommerce Builder you can now design your single product and archive page templates. Here is a breakdown of all the parts that make up a regular WooCommerce product page, and it’s corresponding Elementor Widgets.

Elementor Woo-commerce
Menu Cart Widget Menu Cart Widget – This special custom widget we’ve built, opens the cart in a window, so you can display your cart from any page of your website without leaving it.
Woocommerce Breadcrumbs Widget Woocommerce Breadcrumbs Widget – Control the colors and layout for WooCommerce Breadcrumbs.
Product Title Widget Product Title Widget – Control the style and layout of your Product Title.
Product Price Widget Product Price Widget – Set the Product Price position and style.
Product Rating Widget Product Rating Widget – Add a Product Rating Widget.
Short Description Widget Short Description Widget – Control the Short Description layout and style.
Product Stock WidgetProduct Stock Widget – Add a Product Stock Widget to display the product’s stock number.
Add To Cart WidgetAdd To Cart Widget – Control the layout and style of the Add To Cart button.
Product Meta WidgetProduct Meta Widget – Set the distance between the text, display it stacked or inline, and control the style of your Metadata.
Product Data Tabs Widget Product Data Tabs Widget – Control the Data Tabs style.
Product Images Widget Product Images Widget – Set the image or gallery you wish to display.
Upsells Widget Upsells Widget – Set your own style to the Upsell Products.
Product Related WidgetProduct Related Widget – Set your own style to the Related Products. *See note below.
Additional Information WidgetAdditional Information Widget – Add  Additional Information to your product display.

How to create a Single Product Template

  1. Under Templates > Theme Builder > Single ProductAdd New, from the dropdown choose Single Product, give it a name, and click Create Template.
  2. Choose a Single Product Block and Insert. Alternatively, you can design your own.
  3. After you’ve finished designing, click Publish.
  4. Choose a Condition. Click to learn about conditions.

Important! In order for the Woocommerce Builder to work, you need Elementor pro 2.1 + WooCommerce 3.4 or higher.

*Note: The Product Related Widget uses the WooCommerce related products function to link products with the same tags and categories, not with the same up-sells and cross-sells.

Have more questions? We’re more than happy to assist.

Link is copied to clipboard!
On this page

Is this article helpful?

Share this article