Comment on page
🛒
How to create WooCommerce Product Slider
Learn how you can create a WooCommerce product slider using block slider query.
In this guide i'm going to demonstrate how you you can create a product slider with WooCommerce and block slider.
This guide is going to assume that you have WooCommerce products setup and ready to create a product slider.
Block slider provides WooCommerce Query support out-of-the-box so you can filter the products based on the stock status or sale status.
You can also insert woo commerce blocks directly in the query slider and it'll inherit the current product automatically.
Simply navigate and create a query slider if you haven't already (read the article below to learn how to use a query slider).
Now, Let's set the query post type to "product" created by woocommerce.
selecting the post type
You can now insert woo commerce blocks directly inside the slide to inherit and display the current product details.
inserting woo blocks
When you select the post type "product", Block slider displays an additional panel specifically for WooCommerce providing you more flexibillity to modify/tweak woo commerce related queries.
woo query controls
Let me go through what each control does in the WooCommerce query control
- 1.Show Sale Product: When this is toggled on, block slider will only query the products that are on sale (means the product that has a certain discount).
- 2.Stock Status: You can filter the products based on their stock status using this control.
Creating a product slider is really easy with block slider. You can further customise the product query if you have a more complex query need with the following filter.
Last modified 3mo ago