WordPress 5 Cookbook

Displaying WooCommerce products with Gutenberg blocks

Follow these steps to add and display selected products using Gutenberg blocks:

1. Click the Add New submenu item of the Pages menu.
2. Add a title for the page.
3. Click the Add Block icon to add a new block to the page.
4. Type Woocommerce into the search box to filter WooCommerce-specific blocks.
5. Click the Hand-picked products block to get a screen similar to the following:

6. Select the products from the list shown or use the search to filter the products you need.
7. Once you've selected a few products, click the Done button to preview the added products inside the editor.
8. Use the section on the ...