I have been asked several times about the feasibility and benefits Build an online store using Elementor and WooCommerce.
You probably already know Elementor, but if you’re one of the few who don’t know it yet (really don’t yet?), run to it see this articlein which I explain what it consists of and what you can do with it.
Basically, it is the best WordPress plugin to create any type of website and give it the design you want. And yes, when I say any type of website, I also mean an online store built with WooCommerce.
In order to see what possibilities exist when creating an online store with Elementor + WooCommerce, I will show you all the possibilities that this combination offers.
What will you find here?
Elementor and its widgets for WooCommerce
I already talked a little about this in the article about possibilities Customize WooCommercebut Elementor Pro comes with several WooCommerce-specific widgets which you can use on any page, both on the page that displays the product catalog and on any other page.
On the one hand, you have the following widgets that you can add to any page:
Products: allows you to display a personalized product catalog so that you can choose how many product columns and rows to have, which products to display (all, sale products, selected products or even products you have manually listed) or which categories and/or tags to include or exclude . Also, you have several options for ordering them
WooCommerce breadcrumbs: This widget is not very mysterious, it basically allows you to add paths to pages and customize their fonts and colors.
Add custom to cart: This widget allows you to display and customize a button that, when clicked, adds the product you’ve specified to your cart. It is ideal for viewing in one landing pagein a blog post or any other page where you present the product or service you sell.
WooCommerce sites: Allows you to display one of the WooCommerce pages on the page you want: Cart, My Account, Checkout, Order Tracking, or even a product page you specify. This allows you to create a custom page where, for example, not only the shopping cart is displayed, but also any other section added with Elementor that interests you.
product categories: This widget is used to display the product categories you have created in WooCommerce, allowing you to choose the number of columns and the number of categories displayed, as well as the type of categories displayed.
Cart menu: This widget allows you to add a shopping cart instead of the web you want and customize it. Make a note of it ElementorProYou can create web headers to make this widget visible across the web.
Widgets for creating WooCommerce products with Elementor Pro
In addition to the general widgets we just saw, Elementor Pro allows you to create product page layoutsand includes some specific widgets for that, namely the following:
I won’t explain them one by one because I think it’s pretty intuitive, but as you can see there is a widget for every element that appears by default on a WooCommerce product page: title, description, short description, images, price, card info, add button to cart, reviews, related products, inventory, etc.
Thanks to these widgets and with the help of Elementor Pro templates, you can create a custom design for your product page, including the elements you want and in the layout you want. This avoids the typical default WooCommerce theme.
Of course, you can combine these widgets with other Elementor widgets to get a completely personalized and unique design for your store 🙂
In addition, Elementor Pro allows you to add conditions when viewing a template so that you can see it in all products, in products of the category you specify, in specific products you want, etc.
Action options The design of your online store with Elementor Pro + WooCommerce they are endless.
What theme can I use with Elementor + WooCommerce?
Another frequently asked question is Which theme is ideal for using the combination of Elementor Pro + WooCommerce?.
Although Elementor allows you to customize the design of your store pages, what is the design of how the products are presented (i.e. the design of product grids, galleries, buttons, tabs, etc.) etc.). it is determined by the styles included in the theme you are using.
Although you can always change them by adding a like CSS hero to leave the store as you wish.
The fact is that to date there are some themes that have become popular due to their perfect harmony with Elementor and WooCommerce.
Among them, you can click on the links that I will leave for you to learn more about them generate print, OceanWP or aster.
I have used these three topics and it is true right now I wouldn’t agree to use others with Elementor and WooCommerce.
They all have their similarities and differences, but they more or less share the same style of theme: lightweight, highly customizable and very versatile when it comes to designing any kind of website or online store (while talking about their paid versions tell who they are make miracles as they are).
Another option would be to use the Hello theme from the creators of Elementor, which is a completely simple theme and is simply meant to be used as a base for creating a whole web theme with Elementor Pro.
Findings
Well, finally, to the question «Is it advisable to use Elementor with WooCommerce to create an online store?» is the answer If you want to have a visual and personalized store, yes.
You will find many themes that prove to be very nice when creating an online store (in forest theme You’ll find thousands of them), but when it comes to wanting to customize something, you’ll most likely run into limitations, since the theme doesn’t allow you much customization, other than the junk that most tend to come with.
With Elementor Pro, WooCommerce and some of the themes I mentioned in this post, you have a great foundation to build and customize your online store from top to bottom 🙂
