Elementor WooCommerce Themes These WooComerce Themes are included in the Elementor WordPress Themes & Plugins Bundle. Themes are available for individual purchase also. But purchasing bundle will be more cost effective. Hello is a responsive theme, and lets you fit your pages to any device. WooCommerce Builder Hello is the best choice when building your store with Elementor WooCommerce Builder.
Description
WooLentor is a WooCommerce Addons for Elementor Page Builder. WooCommerce Builder is included in this plugin to build custom product page and archive page.
42 product layouts, awsome style options. It can show latest products, Best Selling products, On Sale Products, Featured products, Category products. This plugin has the options to add unlimited background colors and images to make your product slider/Tab more professional.
Live Demo | Documentation | Purchase Pro
WooCommerce Builder Includes
10 Best WooCommerce Themes For Your Online Store 2021 Colin Newcomer March 4, 2020 16 Comments. Fast loading, flexibility, and the level of integration with WooCommerce are crucial when deciding on a WooCommerce theme. Here’s a list of 10 great themes for creating a beautiful quick-loading, conversion-optimized WooCommerce store. Martfury is a flexible WooCommerce theme Elementor users will love. It’s finely-tuned with the page builder in mind, making for a seamless user experience. Inside you’ll find 10+ home page demos, mega menu navigation and a selection of custom header layouts.
🛍️ Single Product page builder.
🛍️ Custom Product Template Builder for Individual Product(Pro).
🛍️ Shop / Archive page builder.
🛍️ Individual Archive Page Builder (pro).
🛍️ Cart / Checkout / My account / Thankyou page builder (Pro)
You can see the plugin demo here : Live Demo
Free Features (25):
- WooCommerce Template Builder (Basic)
- Product Grid
- Product Slider
- Product Tab
- Action Buttons in different Positions
- Sale / Discount Schedule Counter
- Enable / Disable Product Gallery
- Unlimited Color and font Variations.
- Slider Control Options
- Sales Notification (Real)
- Sales Notification (Custom)
- Rename labels
- Call for Price
- Suggest Price
- Special Day offer banner
- Product QR Code
- Custom Product Template Builder
- Product Grid (Curvy)
- Product Accordion Listing
- Product Image Accordion
- Shop Page Builder
- Ajax Search Widget
- Ajax Add to Cart (In Product Detail Page)
- Horizontal Filter Demo
- Vertical Filter Demo
- Template Library (Basic)
- Free WooCommerce Themes
Premium Features (14):
✓ Rename Label (Advanced)
✓ Custom Product Template Builder for Individual Product
✓ Individual Archive Page Builder
✓ Custom Cart Page Builder
✓ Custom Checkout Page Builder
✓ Custom My Account Page Builder
✓ Sticky Add to cart
✓ Template Library (Premium)
✓ 5 Premium WooCommerce Themes
✓ WooCommerce Template Builder (Advanced)
✓ Phone Call Support
✓ Premium Support
✓ Zoom/Skype/TeamViewer Support
✓ Free Store Setup (Maximum 2)
Available Widgets:
General Widgets
Product Tabs – Display your products in a tabbed format based on different categories.
Add Banner – Create a banner section and control the style and layout of the banner.
Special Day Offer Banner – Create a banner for any special day offers like Black Friday, Cyber Monday, Christmas, etc.
Image marker – Describe a product by adding markers on different parts of that product’s image.
Universal Product Layout – Create your own customized layout to display your products from several different options available in this widget.
Category List – Control the product category list style according to your requirements.
Brand – Showcase brand logos within a grid or carousel layout.
Customer Review – Display customer reviews and control the style and layout of the reviews.
Product Curvy – Showcase your products in an attractive card layout with circular images.
Product Image Accordion – Add a stunning image accordion for your products to grab the attention of your customers.
Product Accordion – Add a simple but effective product according to your store and customize as per your needs.
AJAX Search Form – Incorporate an AJAX search form to your store so that your customers can get live search suggestions when searching for a product.
Template Selector – Create a custom Elementor template by utilizing this very widget and use it anywhere you want.
For Single Product Page:
Product Title – Control the layout and styling of your product title.
Product Description – Get control over the layout and style of your product description.
Product Short Description – Manage the layout and style of your product short description.
Add to Cart – Manage the style and layout of the Add to Cart button.
Additional Information – Add additional information for your products.
Product Data Tabs – Enables you to control the data tabs style.
Related Product – Set the number of related products to display and change the style according to your needs.
Related Product Layout (Custom) – Create a more customized layout to display the related products. (Pro)
Product Price – Set the style for the product price of your product.
Product Rating – Control the product rating style.
Product Reviews – Display product reviews and a form for the customer to submit a review.
Product Image – Take control over the styling of your product image and thumbnails.
Advanced Product Thumbnails – Control the product thumbnails layout and show/hide the sale badge. (Pro)
Advanced Product Thumbnails with Zoom – Showcase your product thumbnails with a zoom effect.
Product Video Gallery – Add videos to the product thumbnails gallery and get control over the gallery position.
Upsell Product – Set the number of upsell products to display and change the style based on your needs.
Upsell Product Layout (Custom) – Create a more personalized layout to display the upsell products.(Pro)
Product Stock – Control the style of your product stock status.
Product Meta – Customize the style of your product metadata.
Call for Price – Allows you to add a button using which your customers will be able to call you to know the price of your products.
Suggest Price – Insert a button to get suggestions from your customers regarding the price of your products.
QR Code – Allow your customers to add any products to their cart just by scanning the QR code from their mobile phone.
Social Share – Enable your customers to share your products on different social media platforms. (Pro)
Stock Progress Bar – Add a progress bar to display the number of ordered products and available products. (Pro)
Product Sale Schedule – Set up a discount scheduler for each product that is on sale. (Pro)
Cart Page Widgets (Pro):
Cart Table – Control each and every element of the cart table and customize the action buttons.
Cart Total – Manage the style and layout of the cart total table.
Empty Cart Message – Change the empty cart message text and customize the style.
Empty Cart Redirect Button – Get full control over the redirect button of an empty Cart page.
Cross Sell Product – Set the number of cross sell products to display and control the style.
Cross Sell Product Layout (Custom) – Create a more personalized layout to display the upsell products.
Checkout Page Widgets (Pro):
Checkout Additional Info Form – Modify the fields and style of the additional information form.
Checkout Billing Form – Get full control over the fields and styles of the billing form.
Checkout Shipping Form – Manage all the fields and necessary styles of the shipping form.
Checkout Payment Method – Set your own style for the payment method section of the Checkout page.
Checkout Coupon Form – Control the layout and style of the coupon form effortlessly.
Checkout Login Form – Customize the login form as per your requirements.
Checkout Order Review – Change the style of the order review form exactly the way you want.
My Account Page Widgets (Pro):
My Account – Control the navigation menu items and style of the account page.
My Account Dashboard – Display the dashboard options from the account page separately and set your own style.
My Account Download – Display the download options from the account page separately.
My Account Edit – Show a form for your customers to edit the account information and control the style of the form elements.
My Account Address – Enable your customers to provide their billing and shipping details.
My Account Login Form – Control the layout and style of the customer login form.
My Account Register Form – Control the layout and style of the customer registration form.
My Account Logout – Show a link to log out and customize the link based on your needs.
My Account Order – Display the order details from the account page separately.
Shop or Archive Page Widgets:
Product Archive Layout – Display your products using the theme style and customize the necessary styles if necessary.
Product Archive Layout (Custom) – Display your products using a more customized layout and get control over the styles of every element. (Pro)
Horizontal Filter – Show various product filtering options horizontally and take absolute control over the styles and layouts of the filters.
Vertical Filter – Display several product filtering options vertically and get complete control over the styles and layouts of the filters.
Key Features:
Sales Notification
This feature allows showing the sales notification or popup to display real/fake orders. In the dashboard, there is option to manage the design of the notification. Check the video for more details.
Rename Label
WooLentor allows renaming label for Shop, Product details, Cart, Checkout page text. For example, add to cart button text and checkout page fields text.
Call for price
You may have product without any price. Your customer can call you to know the price. We found many websites where they display products without any price. For this type of website, we added these features. If anyone clicks on the “Call for price” from a mobile, a customer can easily contact you by phone call.
Suggest Price
Your customer can suggest a price for your products. You can add this button anywhere on your product detail page. We put it on the right side of the add to cart button. If a customer clicks here, a contact form will open to send the price suggestion.
Special Day Offer Banner
There are many special days like Black Friday, Chrismas Day, Haloween day. Discounts and offers can increase store sales these days. a banner can attract attention of visitors and sometimes it increases a 15-30% conversion rate. Recently we add a widget for adding a special day offer.
WooCommerce Checkout Page Customization and Field Editor (Pro)
WooLentor Pro allows us to customize the checkout page to reduce the bounce rate and increase the conversion rate. Sometimes, a custom checkout page is necessary for an eCommerce store. WooLentor Pro makes it easy. Besides creating a custom checkout page, WooLentor allowing remove or edit checkout page fields (billing and shopping fields).
customize WooCommerce single product template
WooLentor allows us to create a custom single product template. Create a unique design for your product page. Free version has the option to create a common product page template, the pro version allows to create a different design for each product page.
Multi-Step Checkout (Pro)
The checkout process is the most important step in your customer’s journey, and it should be as easy and seamless as possible. That’s why we created our Multi-Step Checkout feature that allows you to create a more effective and organized checkout page by dividing the process into several simpler steps.
Extensions:
❤️ WishSuite
WishSuite is a fantastic WordPress plugin that enables you to integrate the wishlist feature on your WooCommerce store. With the help of this extraordinary Wishlist plugin, you can provide a seamless shopping experience to your potential customers by allowing them to create a wishlist and add their desired products to that wishlist so that they find all their items in one place later.
⚖️ EverCompare
EverCompare is a wonderful WordPress plugin that lets you add a product comparison option to your WooCommerce store using which your store visitors will be able to compare different products in a table layout or a popup window. This allows them to check the differences among the products based on several attributes while helping them make the buying decision easier at the same time.
💰 Whols
Whols is an outstanding WordPress plugin for WooCommerce that allows store owners to set wholesale prices for the products of their online stores. This plugin enables you to show special wholesale prices to the wholesaler.
📋 JustTables
JustTables is an incredible WordPress plugin that lets you showcase all your WooCommerce products in a sortable and filterable table view. It allows your customers to easily navigate through different attributes of the products and compare them on a single page.
💷 Multi Currency
Multi-Currency for WooCommerce is a prominent currency switcher plugin for WooCommerce. This plugin allows your website or online store visitors to switch to their preferred currency or their country’s currency.
WooLentor Pro Features:
- 41 Elements
- WooCommerce Teplate Builder (Advance)
- 15 Product Custom Template Layouts ( Deafult + Invidual)
- Cart, Checkout, My Account, Registration Page Builder.
- Individual and Default Archieve Template Builder.
Purchase WooLentor Pro
Video Tutorials:
How to customize woocommerce single product template
Build Custom My Account Page (Pro Feature)
WooCommerce Checkout Field Editor (Pro Feature)
WooCommerce Multistep Checkout (Pro Feature)
Product Filters
More Video
Free WooCommerce Themes
99fy is a free WooCommerce theme. 99 demos for 24 niche categories are included in this theme.
More Details / PreviewParlo WooCommerce Theme
More Details / Preview
Premium WooCommerce Themes Included in The Pro Version
We have included a few premium WooCommerce themes in the WooLentor Pro Package to save money of our customers.
Flone
Flone is one of our most popular WooComemrce Themes using by 1000+ stores.
99Fy Pro
Pro version of 99fy is included in WooLentor pro. 99 demos for 24 niche categories are included in this theme.
Holmes
Holmes is a multipurpose premium WooCommerce Theme.
Check all of the themes, included in the Woolentor Pro version.
Need Help?
Is there any feature that you want to get in this plugin?
Needs assistance to use this plugin?
Feel free to Contact us
Absolute Addons for Elementor Page Builder
Don’t forgete to check our Absolute mega addon for Elementor page Builder.
HT Mega – Absolute Addons for Elementor Page Builder
Includes 360 Blocke & 15 Landing Pages.
Elementor page builder is required for this plugin.
Elementor Pro is not required. But you can use wooLentor with Elementor free & Pro.
Installation
This section describes how to install the WooLentor – WooCommerce Addons for Elementor Page Builder plugin and get it working.
1) Install
- Go to the WordPress Dashboard “Add New Plugin” section.
- Search For “WooLentor”.
- Install, then Activate it.
OR:
- Unzip (if it is zipped) and Upload
woolentor-addonsfolder to the/wp-content/plugins/directory - Activate the plugin through the ‘Plugins’ menu in WordPress
2) Configure
- After install and activate the plugin you will get a notice to install Elementor Plugin ( If allready install it then do not show notice. ).
- To install the plugin click on the “Button” Install Elementor.
- ‘WOOLENTOR’ Category will be appear in Elementor page Editor
- Create new Product slider or product tab and relax!
Reviews
Do you want to create a WooCommerce website with the Elementor page builder? Want to learn what all you can do with WooCommerce and Elementor with the Elementor WooCommerce builder? Want to customize WooCommerce pages such as Single product pages, Archive pages / Product category pages, Cart page, Checkout page, and other shop pages with Elementor?
You have come to the right place. In this article, we will discuss in detail everything you can do with WooCommerce and Elementor to create a unique and elegant WooCommerce website of your dreams.
Elementor WooCommerce Theme
Before we move on to working with Elementor page builder you first need to find an Elementor WooCommerce theme that best suits the kind of WooCommerce store you want to create.
We suggest you go with the free Astra Theme, which is one of the best Elementor WooCommerce themes.
It has ready-made demo sites that you can easily import and customize. See this tutorial to install Astra theme and import demo sites in less than 5 minutes.
Astra Theme + Elementor Pro + WooCommerce = Dream eCommerce Store
If you want more options, you can choose from the list of best Elementor WooCommerce themes, these themes work best with Elementor page builder.
There are other best WooCommerce Elementor themes that are themes specially made for WooCommerce stores than work well with Elementor. Many of them are free themes.
Installing and Setting up the WooCommerce plugin
Before you can customize your website with Elementor you need to install and setup the WooCommerce plugin on your WordPress site.
Note: if you already have a WooCommerce store with products you can skip this part and move to the next part.
In your WordPress dashboard, go to Plugins → Add New and search ‘WooCommerce’. Install and activate the WooCommerce plugin.
You will be taken to WooCommerce Setup Wizard.
See how to use the Setup Wizard here.
Here you only need to fill the basic details and can skip the unnecessary parts. You can edit and change things later. Especially, you can skip the Choose a Theme page, if you have already installed the Elementor WooCommerce theme of your choice.
You can also choose to use the free Storefront theme in this option. The Storefront WooCommerce theme does work with Elementor but it has limited features and it is not recommended.
After configuration, now add products to your store. In the dashboard go to Products → Add New, add your products and fill all the details. For more details on creating WooCommerce products see here.
After creating all your products we can move on customizing with Elementor WooCommerce builder.
How to User Elementor WooCommerce Builder to Create a Dream eCommerce Store:
There are 3 ways in which you can use the Elementor for WooCommerce:
- Create and set Elementor templates for Single Product page
- Create a WooCommerce Shop page and Product Archive pages
- Create a custom cart page and checkout page
How to use the Elementor WooCommerce widgets for your store?
Elementor WooCommerce builder is a feature that comes in the Elementor Pro version that gives you 14+ Elementor WooCommerce product widgets. If you want to use the WooCommerce builder you have to get the Elementor Pro Page Builder.
- Product Title widget – Customize the style and layout of the Product Title
- Breadcrumbs widget – Helps customers to navigate your store by showing WooCommerce Breadcrumbs. You can edit colors and layout for the breadcrumbs
- Product Image widget – Set Image or image gallery the product
- Product Rating widget – Set the style and position of the Product Rating where it is to be displayed in the Single Product template
- Product Price widget – Choose the position and style of the Product Price
- Custom Add to Cart widget – With this widget, you can add an Add To Cart button anywhere on your site and help visitors to make the purchase
- Product Data Tabs widget – With this widget, you can add Data Tabs with product specifications such as dimensions, description, color, etc. You can change the Data Tabs style
- Product Stock widget – You can add a Product Stock Widget to display the product’s stock number
- Additional Information widget – This widget shows the Additional Information of your product
- Product Content widget – Set your own style to the Product Content
- Product-Related widget – Set your own style to the Related Products
- Upsells widget – Set your own style to the Upsell Products
- Short Description widget – Customize the layout and style of Short Description
- Product Meta widget – Control the style and position of your Product Metadata
1. How to create an Elementor Single Product Template
First, we need to allow Elementor for the WooCommerce products. To do this go to Elementor –> Settings –> General
Here, tick the checkbox near Products in the Post Types, as you see in the image below.
For creating Elementor templates for WooCommerce you have to use the Theme builder features. To do this,
- In your WordPress dashboard, under Elementor, go to Templates → Theme Builder → Single Product → Add New
- You will see a dropdown from this choose Single Product, give it a name, and then click Create Template
- You would see an empty page like the one above, here you can click the file icon and you will ready-made Elementor templates known as Single Product Blocks
- You can choose any block from this and click Insert and the ready-made block will be inserted into your single product template
- Then you can make the changes to this and customize your template
- Alternatively, you can design your own single product template from the scratch by dragging and dropping all the required Elementor WooCommerce product widgets such as Product Title, Product image, Product price, etc.,
- After you finish designing, click the Publish button
Choosing the Display Conditions to Apply the Single Product Template
Now that we have created the single product template, we have to decide where this template will be applied. You can choose to apply this template for all single product pages in your shop, or for a specific product or product category. To apply the Display Conditions,
- Near the ‘Publish’ button you can find an upwards arrow, if you click it you can find the ‘Display Conditions’ option, click it
- In the Publish Settings page click, ‘Add Condition’ decide where this template will be included
- You can also choose to exclude a certain page from using this template
- Then click ‘Save and Close’ and your template will be applied to all the single product pages in your WooCommerce website.
You can also create and edit individual WooCommerce products by going to the product page in the Dashboard and clicking ‘Edit with Elementor’. If you do this you have to add an ‘Exclude’ condition for the particular product page in the Single Product template display condition.
2. Create a WooCommerce Shop page / Product Archive Template with Elementor
Before we move to create a shop page with Elementor, you need to know the parts of a Shop page that you can customize from the WordPress Theme Customizer.
You can go to the WordPress Customizer from the Dashboard by going to Appearance → Customize
Here you can customize the options such as:
- Enable/Disable store notice,
- Choose how and what products are displayed in the product catalog, and
- Adjust product image ratio
Creating WooCommerce Shop Page with Elementor:
Creating a Shop page / Product archive template is similar to that of Single Product Template but with some minor changes.
Go to Templates → Theme Builder → Single Product → Add New
Here choose Product Archive and give a name for the template.
In this page, you can use the following Elementor WooCommerce widgets listed below to create your shop page design.
- Menu Cart widget – This special custom widget that opens the cart in a window. You can display your cart from any page of your website without leaving it. With the Menu Cart widget, you can place a WooCommerce cart icon in your menu or anywhere on your page.
- Products widget – This widget allows you to display products on any page of your site. You customize the Product content and style that suits your store.
- Product Categories widget – With this widget you can display a grid of WooCommerce Product Categories anywhere on your site
- WooCommercePages – This widget allows you to display any WooCommerce Page such as Single Product Page, Checkout Page, Cart Page, Order Tracking Form, or My Account Page on any page
- WooCommerce Breadcrumbs widget
- Add to Cart widget
You can also use various Elementor widgets such as Archive Title. Archive Products, Archive Description, etc,
When you’re done click ‘Publish’, then go to ‘Display conditions’ and include the Shop page and click ‘Save and Close’.
To create templates for various product categories, then in the Display Conditions choose ‘In Product Categories’. If you want different templates for different product categories you can use the Include/Exclude options to apply the template in specific product category pages.
3. Creating WooCommerce Checkout page with Elementor
When you’re creating a WooCommerce checkout page with Elementor, you can’t actually add or edit the checkout fields. If you want to edit the checkout fields then you need to use a WooCommerce checkout field editor plugin.
To create a new checkout page with Elementor you need to apply the [woocommerce_checkout] shortcode in the new Elementor page. This applies the checkout features to the page. You can use the Elementor widgets and add other designs you need on the page and publish it.
Then go to WooCommerce → Settings → Advanced and add the new page as the checkout page.
Elementor Woocommerce Hello Theme
4. Creating WooCommerce Cart page with Elementor
In the same way we created the Checkout page you can create the WooCommerce cart page with Elementor.
You can use the shortcode [woocommerce_cart] on an Elementor page and then add any designs you want to the page and publish it.
Then add this new page to the WooCommerce Settings.
Woocommerce Themes Elementor
Hope this article helps you to use the Elementor page builder for your WooCommerce store. If there are any questions or anything more that you want us to cover on this topic, please mention it in the comments section.