How to Add a Product Recommendation Quiz Using the Gutenberg Block in WooCommerce

Product Recommendation Quiz for WooCommerce publishes each wizard as a shortcode you paste into a page or post.

If you build pages in the block editor, there is now a block that does the same job. You pick the wizard from a dropdown instead of copying a shortcode and hoping you got the ID right.

For example, a store adding a "Find your fit" quiz to a landing page inserts the block, selects that wizard from the sidebar, and publishes — no shortcode involved.

Benefits

Using the block instead of the shortcode can help:

• Avoid wrong-ID mistakes, since you choose the wizard by name.
• Keep page building inside the editor, with no switching between tabs to copy a shortcode.
• Stretch the quiz to wide or full width using the editor's own alignment controls.

How to add a wizard with the Gutenberg block

Step 1: Confirm you have a saved wizard

The block lists wizards you have already created. If you have none yet, go to Dotstore Plugins → Product Recommendation Quiz and add one with its questions first.

Step 2: Insert the block

Edit the page or post, click the + inserter, and search for Product Recommendation Quiz. It sits in the WooCommerce block category, and also turns up under searches like wizard, quiz, or finder.

Step 3: Select the wizard

Open the block sidebar and find the Wizard panel. Choose your quiz from the Select wizard dropdown.

The panel then shows a read-only Shortcode field with the matching shortcode, such as [wpfp_4]  , in case you want to reuse it elsewhere. The block in the canvas updates to show the wizard name you picked.

Step 4: Publish and check the page

Click Publish or Update, then view the page. The quiz renders exactly as the shortcode version does — same questions, same styling, same result list.

Inside the editor, you will only see a grey placeholder box with the wizard name, not a live quiz. That is expected; the quiz is rendered when the page loads.

Example Use Cases

Different quiz per category page. If you run several wizards — one for coffee gear, one for accessories — choose the right one from the dropdown on each page instead of tracking which shortcode ID belongs where.

Conclusion

The Product Recommendation Quiz block lets you insert any saved wizard from the block editor by name. The output matches the shortcode exactly, so existing pages keep working while new pages get a faster way to add a quiz.

FAQs

1. The block doesn't appear in the inserter. What should I check?

Make sure the plugin is active and that you are using the block editor rather than the classic editor. Searching for wizard or quiz also finds it if you do not spot it under the WooCommerce category.

2. Why does the block say "No wizards found. Create a wizard first."?

No wizards have been saved yet. Create one under Dotstore Plugins → Product Recommendation Quiz, then return to the page and select it in the block.

3. Does the block replace the shortcode?

No. The block renders the same wizard through the same shortcode behind the scenes, so any shortcode already placed on your site keeps working.