The Contact Form Block is more customizable that it seems. Let’s see how.
If you are using Gutenberg, you probably noticed that you can modify all the labels, the button text, some of the colors, and more. That is probably the simplest way to customize the appearance of the contact form.
You can achieve the same results as if you were using Gutenberg with the shortcode. The contact form should look good already without any attributes, but you might want it to look a bit different. Here is the list of the attributes.
[contact-form-block name_label="Name" email_label="E-mail" phone_label="Phone" message_label="Message" header="false" header_image_id="null" header_image_size="50" header_image_align="left" header_title="Get in Touch" header_text="Leave your message and we'll get back to you shortly." button_text="Send" button_color="#3d84f6" button_text_color="white" theme="default" message_rows="5"] [/contact-form-block]
They are self-explanatory. The theme attribute can be default, meowapps or none.
Modify the receiver of the email
Modify the data received in the form
Validate the form
Modify the subject of the email
Modify the content of the email
Do something after the email has been sent