In this video, I will show you how to set-up your WooCommerce shop page or product archives with Elementor Pro
- First log into your WordPress admin area and make sure that Elementor Pro is installed and activated.
- Next, hover over Elementor and click on the my templates option. From here, you will need to click on the “Product Archive” tab
- If this is your first time you will see a big button saying: “Add new product archive”. Click on this and give a name to your template.
- Click on the create template button and wait till the editor loads up
Let’s close down the template selector and start to build the shop page. In this example I will create a sales section and the actual catalogue or product archive.
- First, lets start a new section, add a heading and a product archive widget
- Add some padding and margin to the section
- Next, let’s style the heading and rewrite it to Latest offers
Time to style the product archive now. For this I will make sure it is 1 row with 4 columns, no pagination or other bit needed for this section. In the query settings we will need to set the source to sale and the order to popularity. After this, we can set the desired styling for the products under the style tab, give some padding to the widget and done.
Next, right click on the section and click on the duplicate option this will make the styling part super easy! Let’s remove the heading and start editing the product archive widget. First, set the row and column settings and turn on the pagination. At this point we got two more options: allow order and results counter. I will turn on both for this demo.
Next, we will head over to the query’s part and set the source to current query. At this point, we only need to edit the styling if you wish to make this section look different to the sales items. Let’s hit the publish button and set the condition to the shop page only. It it this easy to create a simple shop page with Elementor Pro.
If you wish to edit the category archives, repeat the process without the latest offers and set the published conditions to the selected category or archives.
