How-to Gutenberg Block

Schema Pro plugin offers Gutenberg block to add How-to content with inbuilt schema support.

With this block you can design a beautiful How-to section on Gutenberg page with lots of customization options.

Let’s explore what amazing settings this block offers and how it works –

How to Add How-to Schema Pro Block?

When you have the Schema Pro plugin activated, you will see this block appearing in the Gutenberg editor in the block list.

You will observe many fields inside block, where you can add required content.

Steps to use this block –

Step 1 – Edit the page/post with Gutenberg editor and click to add new block.

Step 2 – Search for How-to – Schema Pro block and select it.

Step 3 – You will see some fields already enabled and some you can enable as per requirement. Fields that are initially enabled are required fields. That means you need to compulsory fill them. Below is the list of fields that are initially enabled –

• Title of the How-to block: Add a title to the how-to procedure.
• Description of the How-to block: Write a description of the how-to procedure.
• Steps for How-to process: You can add as many steps as required by clicking on the plus sign.
  • Image for the step: Add an image explaining a particular step.
  • Title of the step: Add a step title.
  • Description of the step: Explain the step in detail.

And below is list of fields that is that is recommended. These fields are not compulsory but you can enable them and add data to avoid warning in schema testing tool.

• Total Time: Approximate time that will require to complete how-to process
• Estimated Cost: Cost of materials, tools, or other things that how-to process will require
• Tools: List of tools that will require to complete the how-to process
• Materials: List of materials that will require to complete the how-to process

Step 4 – Once you are done adding steps, open a style tab and set the design for all elements in the block. You can set colors, typography, and spacing.