Form

A form.

• Name: core/form
• Category: widgets
• API Version: 3
• Block Type: Hybrid (static save + server enhancements)
• Keywords: container, wrapper, row, section

Block Relationships

Allowed inner blocks:
– core/paragraph
– core/heading
– core/form-input
– core/form-submit-button
– core/form-submission-notification
– core/group
– core/columns

Attributes

Defined via the attributes property in block.json.

Supports

Defined via the supports property in block.json.

• anchor: true
• color:
  • gradients: true
  • link: true
• spacing:
  • margin: true
  • padding: true
• typography:
  • fontSize: true
  • lineHeight: true

Block Markup

This is a hybrid block. It saves static markup that the server may enhance during rendering.

<!-- wp:form -->
<form class="wp-block-form" enctype="text/plain">
<!-- wp:form-input -->
<div class="wp-block-form-input"><label class="wp-block-form-input__label"><span class="wp-block-form-input__label-content">Name</span><input class="wp-block-form-input__input" type="text" name="name" required aria-required="true"/></label></div>
<!-- /wp:form-input -->

<!-- wp:form-input {"type":"email"} -->
<div class="wp-block-form-input"><label class="wp-block-form-input__label"><span class="wp-block-form-input__label-content">Email</span><input class="wp-block-form-input__input" type="email" name="email" required aria-required="true"/></label></div>
<!-- /wp:form-input -->

<!-- wp:form-input {"type":"url"} -->
<div class="wp-block-form-input"><label class="wp-block-form-input__label"><span class="wp-block-form-input__label-content">Website</span><input class="wp-block-form-input__input" type="url" name="website" aria-required="false"/></label></div>
<!-- /wp:form-input -->

<!-- wp:form-input {"type":"textarea"} -->
<div class="wp-block-form-input"><label class="wp-block-form-input__label"><span class="wp-block-form-input__label-content">Comment</span><textarea class="wp-block-form-input__input" name="comment" required aria-required="true"></textarea></label></div>
<!-- /wp:form-input -->

<!-- wp:form-submit-button -->
<div class="wp-block-form-submit-button"><!-- wp:buttons -->
<div class="wp-block-buttons"><!-- wp:button {"tagName":"button","type":"submit"} -->
<div class="wp-block-button"><button type="submit" class="wp-block-button__link wp-element-button">Submit</button></div>
<!-- /wp:button --></div>
<!-- /wp:buttons --></div>
<!-- /wp:form-submit-button -->
</form>
<!-- /wp:form -->

Source

• block.json (reference)
• Source directory — browse edit.js, save.js, index.php, and more.