Basically, it is a checkout field editor plugin, but for the WooCommerce block checkout
[youtube
https://youtu.be/kHiKNGsyYCQ]
The WooCommerce block checkout can be edited directly from the Gutenberg editor (open the "WP Admin -> Pages -> Checkout" for editing). By default WooCommerce allows adding only Paragraph/Image/Separator inner blocks to the checkout block. The
SilkyPress Input Field Block plugin lets you add inner blocks with a custom input field to the checkout block.
The plugin creates a block, called
Input Field, which can be added to an inner block of the
Checkout Block. One instance of the block will add one custom field to the checkout form. The block can be added as many times as necessary to the
Checkout Block and can be inserted more than one time within the same inserter place of the
Checkout Block.
Input Field block
settings
After adding an
Input Field inner block to the checkout block, you can change its settings in the
Block Inpector on the right side of the editor. Within the settings
General tab you can set its:
- Field type (
Text, Select, Checkbox, Radio or Textarea)
- Label
- Id
- Default value
- Help text
Input Field
validation on the frontend
In the
Validation tab you can toggle the input field as to be required or optional. On the frontend, if a required input field is left empty by the customer, then, upon clicking the
Place Order button, the
Please fill this field error message will be shown.
Storing the value of the Input Field
After clicking the
Place Order button, the value of the
Input Field will be saved to the database as a custom field associated with the order.
In the
Presentation tab of the
Input Field block's settings you can enable:
- the
Show on Order page option so that the field's value will show up on the Edit Order page in the admin
- the
Show on Order Confirmation option so that the field's value will show up on the customer's Order Confirmation page (formally known as Thank You page)
- the
Show on Order Email option so that the field's value will show up in the email the customer receives after placing the order.