ProductX comes with a lot of crafty features in a very clean overall package. Many will argue that it is one of the best rising Gutenberg Product Blocks plugins on the market right now.
Among many of its features, the Advanced Query Builder is a major one. It lets users create custom WooCommerce Gutenberg blocks for their customers. This way, visitors of your online store can easily find the best offerings from your online store.
So, how do you create a custom WooCommerce Query using the Advanced Query builder of ProductX? Here’s how:
- First of all, plan on what products/category of products you want to showcase.
- Be clear on how you want to order them.
- Publish the Product block on your custom page/post
And that’s pretty much all there is to it. The great thing about ProductX is the fact that it’s super lightweight and doesn’t require exceptional programming expertise. It’s a simple interface that doesn’t take a lot of your time to get used to the whole thing.
So, let’s see how the Advanced Query builder can help us with WooCommerce product showcasing as a whole.
WooCommerce Query: How to Showcase Your Products with the Advanced Query Builder
The ProductX Advanced Query Builder allows the user(s) to create custom WooCommerce Queries for Products. You can create custom Gutenberg Product blocks to showcase different products according to the customization rules that are baked into the plugin’s query builder.
In this quick guide, we’ll show you how to use the Advanced ProductX Query Builder and go through each of the options in detail.
First of all, let’s start with building a Gutenberg block that’s shows products based on average product rating. We’ll be showing the top-rated products in a shop page.
Choose a Product Block from the Block Library
The ProductX block library comes with a wide range of pre-built Gutenberg blocks and starter packs. The pre-made blocks are small product grids or sliders that are fully customizable.
And the starter packs are ready-made page templates comprising of a couple of ready-made blocks. Again, each of the product blocks is customization-ready and doesn’t require extraordinary expertise.
For now, we’ll stick with a free Product Grid block from the ProductX block library. To do this:
- First of all, make sure to Install and Activate the ProductX plugin [The process is the same as any other plugin].
- Then create a page by going to Pages>Add New to add a new page. Or you can simply go to an existing page on your WooCommerce store if you wish.
- Now, go to ‘Block Library’ on the top right. Click on it.
- Once the block library appears, you can choose between free and paid block designs. Also, you can choose between ready-made blocks or starter packs.
- Find ‘Product Grid #3’ and click on Import. It will bring that block to your page.
Once you hit import, you’ll find the ready-made block on the page. If you choose the product block, you’ll find the settings on the right-hand side.
***You can always access the ProductX Documentation to learn more.
Under the Design tab, you have the option to choose between other design variations. If you’re a pro user, then you can make the most of this functionality. Also, from the Advanced tab, you have the option to add additional CSS properties, change the box, padding, and other design settings.
Under the Setting(s) tab, you’ll find the Quick Query (Advanced Query) that we’re going to talk about here.
Using the quick query option, you can easily create a custom WooCommerce query for products. It’s a simple click-and-play type of scenario.
Change the General Settings
Before moving on to working with the advanced query, we will take care of some basic settings:
- Under the General tab, Choose ‘Grid View’ from the Product View dropdown. You can also showcase your products using a dynamic product slider using from this menu.
- Keep the number of ‘Columns’ to 2 using the slider.
- Make the Column Grid Gap 30PX and the Row Gap 50PX using the slider. You can enter the values manually as well.
- Choose ‘Content Layout 2’ from the Content Layout Dropdown. We’ll keep all other options to default.
ProductX Query Builder: How to Customize Gutenberg Product Blocks
Now we’ll move on to the key part of our discussion, which is using the ProductX Advanced Query Builder.
In order to show you the query builder in action, we must first talk about the features of the query builder:
The Quick Query Dropdown
When you’re using the productX WooCommerce plugin, this is the first important option you’ll find.
In the dropdown menu, you’ll find Pre-defined options to show products with the best ratings, review count, popularity, sales numbers, view count, and more. If you wish to show the users only the top-rated products, then you can choose the option from the dropdown menu.
Number of Products and Offset Products
ProductX gives you the option to choose the number of posts you want to show in a ready-made block. You can adjust the slider or input the number of posts to show the number of products you desire.
Then there’s the ‘Offset Products’ feature which often comes in handy when you’re creating multiple product blocks on a page and do not want the same products to show up in each block. It’s a quick little feature most users may come to appreciate.
Categories
You can set the category of products from the Advanced Query builder as well. Just choose the categories from the dropdown and you’ll see them in the product block.
Product Status
You can also show products that are on sale from the quick query. There are other pre-defined features as well.
Order Products
You also have the choice to order products according to their dates, alphabetical order, pricing, and more. These pre-defined options do come in handy when you’re trying to build a Gutenberg product block to showcase products in a particular order.
Include/Exclude Products
Many of you will appreciate this feature.
You can easily enter the product ID and it will either be included or excluded from the block. This lets you add or hide specific products that you may or may not want to show your customers. Again, it’s a super handy feature!
Product Block Customization
We’ll now show you the ProductX WooCommerce Query Builder in action. We’ll show you how to build a product block to show the top-rated accessories in a WooCommerce page. We’ll do the following:
- Choose ‘Accessories’ from the Category as we’re trying to show the accessories to our users.
- Choose ‘Top Rated Product’ from the Quick Query dropdown. It’ll show the products that have the most ratings within the category.
- Change the Product Status to ‘On Sale’ from the dropdown.
- We’ll choose ‘Date’ from the ‘Order By’ menu as we want our products to show up according to their dates.
- We don’t want to include/exclude any products. So, the ‘Offset Product’, ‘Include Product’, and ‘Exclude Product’ settings will remain default.
Follow these steps correctly and then you have a Gutenberg Product block that’ll look like the following:
Common FAQ about the ProductX WooCommerce Product Blocks
Q: How can I build a Custom WooCommerce Query?
Ans.: For those of you who are familiar with the inner workings of WordPress, you can easily use WooCommerce Code References to build custom queries. But in order to do so, you will need a fair bit of expertise.
Whereas with ProductX, you don’t need to be an expert in WordPress coding. All you need is the working knowledge of the plugin. And that’s basically it!
Q: Does ProductX have support for Shortcode?
Ans.: Yes, ProductX has custom shortcode support. You can easily create assets and use the shortcode to implement them wherever you wish. But you will need to purchase the pro version to make that happen.
Q: When I use ProductX, will it slow my site down?
Ans.: ProductX is built with agility in mind. There’s minimal coding, so it will not slow your site down.
Q: Can I use ProductX with builders like Divi, Elementor, etc.?
Ans.: Yes, you can. You can use shortcodes to show your content with such page builders.
Final Thoughts
It’s judgment time!
Whether you want to create a custom WooCommerce query with custom coding or any other way is up to you.
We’re only portraying ProductX as a potential choice that takes all the hard work out of the process. It’s mostly a drag-and-drop process.
Do sound off in the comments below and share your thoughts on the matter.
Cheers!
