There are already several times that I have been asked about the feasibility and benefits of making an online store with Elementor-WooCommerce.
Surely, you already know Elementor, but if you are one of the few left who do not know it. Basically, it is the best WordPress plugin to create any type of website and give it the design you like. And yes, when I say “any type of website”, I also mean an online store made with WooCommerce.
So that you can see the possibilities that exist when making an online store with Elementor-WooCommerce, I am going to show you all the options that this combination offers.
Elementor-WooCommerce and its widgets
I already talked about this a bit in the ways to customize WooCommerce article , but Elementor Pro comes with several WooCommerce-specific widgets that you can use on any page, whether it’s a page displaying the product catalog or 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, being able to choose how many columns and rows of products it will have, which products will be displayed (all, products on sale, featured products or even the products that you indicate manually), or which categories and/or labels include or exclude. Besides, you have several options to order them
WooCommerce Breadcrumbs – This widget doesn’t have much of a mystery, basically it allows you to add the breadcrumbs to your pages and customize their typography and colors.
Custom Add To Cart : With this widget, you can display and customize a button that, when clicked, adds the product you indicate to the cart. It is ideal to display it on a landing page , in a blog post, or on any other page where you show a product or service that you have for sale.
WooCommerce Pages : allows you to display on the page you want, any of the WooCommerce pages: cart, my account, checkout, order tracking, or even a product page that you indicate. In this way, you can create a custom page in which, for example, not only the cart is displayed, but any other section added with Elementor that interests you.
Product Categories : this widget is used to display the product categories that you have created in WooCommerce, being able to choose the number of columns and the number of categories that are displayed, and what type of categories are going to be displayed.
Menu Cart : with this widget, you can add a shopping cart in the place of the web that you want and customize it. Remember that with Elementor Pro , you can create headers for the web, where you can insert this widget to be seen on the entire web.
Widgets to create Elementor-WooCommerce products with Pro
Aside from the general widgets we’ve just seen, Elementor Pro allows you to create a product page layout , and includes some specific widgets for it, which are as follows:
I’m not going to explain them one by one because I think it’s quite intuitive, but as you can see, there is a widget for each element that appears by default on the WooCommerce product page: title, description, short description, images, price, tabs information, add to cart button, ratings, related products, stock, etc.
Thanks to these widgets, and using the Elementor Pro templates, you can create a custom design for the product page, including the elements you want and in the layout you prefer, thus avoiding having the typical WooCommerce default design .
Of course, you can combine these widgets with the rest of the widgets that Elementor includes, being able to get a totally personalized and unique design for your store 🙂
In addition, Elementor Pro allows you to add conditions when displaying the template, so you can make it display in all products, in the products of the category that you indicate, in the specific products that you want, etc.
What theme can I use with Elementor-WooCommerce?
Another of the most frequently asked questions is which theme is ideal to use the combination of Elementor-WooCommerce Pro.
While with Elementor you can customize the layout of your store pages, what is the layout of the product presentation (i.e. the layout of the product grids, the gallery, the buttons, the tabs, etc.) etc.) is determined by the styles included in the theme you are using.
Although you can always modify them with a plugin like CSS Hero to finish leaving the store to your complete liking.
The fact is that, today, there are some themes that have become popular for their perfect harmony with Elementor-WooCommerce.
Among them, and you can click on the links that I am going to leave you to know more about them, are GeneratePress , OceanWP or Astra .
I have used these three themes, and the truth is that right now I would not choose any other to use together with Elementor-WooCommerce .
They all have their similarities and their differences, but they are more or less the same style of theme: light, highly customizable and very versatile when designing any type of website or online store (speaking of their paid versions, which are the ones that make them the wonder they are).
Another option would be to use the Hello theme, from the creators of Elementor, which is a totally basic theme and intended to be used simply as a base for creating the design of the entire web with Elementor-WooCommerce Pro.
Well, to finish, to the question “Is it recommended to use Elementor-WooCommerce to create an online store?”, the answer is that if you want to get a visual and personalized store, yes .
You will find many themes out there that turn out to be very nice when it comes to creating an online store (on Themeforest you will find thousands), but when you want to customize anything, you will most likely find yourself limited because the theme does not It allows you to customize a lot, apart from the trash that most people usually bring.
Using Elementor-WooCommerce Pro, and some of the themes that I have mentioned in this post, you will have a great base to create and customize your online store from top to bottom