In this tutorial we are going to see how we can create the main page of our store with WooCommerce and Elementor Pro to our liking.
Common mistake with Elementor and WooCommerce
If you have launched directly to edit the page of your store with WooCommerce, it is very likely that you will get this error and you will not know how to get out of it:
Sorry, the content area for your page was not found.
You must call the 'the_content_' function in the current template, so that Elementor can work on this page.
And we have no choice but to click the button return
Have you encountered this situation? Don't worry we will solve it 😉
The error that the visual builder gives us in the WooCommerce page is due to the fact that WooCommerce itself treats the shop page in a special way and does not allow any external plugin to touch it directly.
If you want to know more about this problem they explain it here.
Create a template with Elementor to solve the problem
In order for WooCommerce not to wage war, what we have to do is first create a template with Elementor and then tell it to be used exclusively on the Shop page through the conditions that Elementor allows us to add. What a great invention 🙂
How do we do this? Very simple, let's do it 😉
Let's go to Elementor —> my templates —> product Archive —> Add New
In add new template select us automatically Product Archive and give it a name:
Now we can choose between a predefined template or make it to our liking.
This time I am going to choose one of the templates:
Once the template is selected, we can modify what we want, with the advantage that we can visually see how it looks:
When we have the page to our liking, we click on publish and here comes the most important part add conditions o add condition
In our case we are going to tell you to take into account this template for the store page
And voila, from now on if you go to the store page you will already have the new design without errors or problems 🙂
If you prefer to see the entire process on video, here is the video tutorial to see the entire process in detail.
Subscribe to my channel:
I hope it has been useful to you 😉
Thank you very much for both this article and the other one on "How to create the WooCommerce product sheet with Elementor Pro". They helped me a lot. It is well explained.
Thank you very much Emelys 😉