Contact form
Last updated
Last updated
In the editor side panel, click (+) Add section and select Contact form. Click and hold the drag handles ⋮⋮
to re-order sections.
Editing a template will change all pages that use that template.
Create and assign new templates to design different page layouts.
Add dynamic content to show page-specific content in the same template.
Click the section to customize the general section styles for colors and spacing, available in all sections:
The Section header appears above the section. Add Headings and Text, then adjust their size and center them in the header.
Click Contact form section to find settings
Setting | Description | Options |
---|---|---|
Center header | Position the header content in the center above the section. | |
Overline | The small text above the heading. | Default: "Overline" |
Heading | The title of the section. | Default: "Contact" |
Heading size | Change the size of the heading text from small to large. | 1-8 Default: 5 |
Heading tag | Change the heading tag to modify the page structure. Use H2 to indicate important topics, and use H3-H6 for related topics. Learn how to replace default H1 headings. This option doesn't change the heading's appearance. | H1 - H6 |
Text | Add multiple lines of rich text. Use the buttons to make the text bold or italicized, or to add a link. | |
Text size | Adjust the size of the section text from small to large. | 1-8 Default: 3 |
Add various types of form blocks to create your contact form.
Text input
Show a text field for customers to add a single word or line.
Text area
Show a text field for customers to add multiple lines.
Select dropdown
A menu of multiple options that requires a single choice.
Radio buttons
A list of buttons for multiple options that requires a single choice.
Checkbox
Multiple checkboxes that allow for more than one selection.
Phone
A text field for the customer's phone number.
A text field for your customer's email.
Submit
(Required) The contact button that sends the message.
Click (+) Add block to add blocks for Headings, Text, and Spacers to help organize and explain the contact form fields. Use the drag handles ⋮⋮
to re-order blocks, and add Spacer and Divider blocks to further customize the layout.
Click Contact form section to find settings
Setting | Description |
---|---|
Show reCAPTCHA terms | Show the terms of service and privacy policy for Google's reCAPTCHA form. Google reCAPTCHA is enabled by default on all Shopify stores to minimize spam from bots. |