Contact form

The contact form section allows customers to submit inquries to your store.

Contact form on the Primavera demo store with a custom "Subject" dropdown

You can customize the fields available in your contact form by adding blocks. Merchants are not limited to one single contact form: you can use multiple contact form sections to create different forms for different purposes, eg. general customer support vs. wholesale inquiries.

Form field appearance can be modified in the Theme settings, under Theme Settings > Appearance > Forms.

You can find out more about where the contact form submissions go by reading the Shopify documentation.

Settings

  • Section header: See common settings

  • Layout:

    • Button style: Choose between the primary or secondary button style.

    • Button width: Choose between the default button width or full width.

    • Horizontal alignment: Choose between left, center and right horizontal alignments. This only affects the button (if not full width) and the header.

Blocks

  • Text: Represents a single-line text field.

  • Email: Represents the customer's email. Limited to one per form.

  • Telephone: Represents the customer's phone number. Limited to one per form.

  • Dropdown: Allows the customer to select one option from a list of options.

  • Radio buttons: Allows the customer to select one option from a list of options. Better if there is only a few options.

  • Checkbox: A single checkbox.

  • Textarea: Allows the customer to enter multiple lines of text.

Block settings

Here are the types of settings you may find in the above blocks:

  • Label: Assigns a label to the block.

  • Required: Allows you to mark a certain field as required for submission.

  • Number of columns: Some fields allow you to choose if the field occupies one or two columns (for desktop only).

  • Options: For fields that accept multiple options (dropdown, radio buttons), you enter the various options by passing a comma-seperated list of items. eg. 'Red,Blue'

Can't find the setting you're looking for? The following settings are explained in detail in common settings:

  • Container width

  • Color scheme/Color scheme transition

  • Padding

  • Borders

Last updated

Was this helpful?