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.