Contact form

Reference All plans 2 min read

A small form (name, email, phone number, message and a send button) so customers can ask a question without leaving the page. It uses Shopify’s own contact form, so messages arrive the same way as from your store’s contact page.

Add the block

1. Pick the layout

   In the mega menu panel of the preview, click Add block. Click Contact form, hover over Contact and click Select.

   

   (1) Click Contact form, (2) pick Contact.

   The other layout, Newsletter, adds an email sign-up form. See Newsletter.

2. Set the texts

   In Edit Item, change any texts you want. All are optional; empty fields use the default labels.

   

   The Contact form block in the preview, with its settings in Edit Item.

3. Save, publish and test

   Click Save, then Publish. Send a test message from your live store to check that it arrives.

Settings

WidthDefault: 50%

How much of the mega menu row the block takes: Auto or 8.33% to 100%.

TitleDefault: Contact

Heading above the form.

DescriptionDefault: Empty

A short text under the title, for example your opening hours.

Name, Email, Phone number, MessageDefault: Default label

The placeholder text inside each field.

SendDefault: Default label

The text on the submit button.

Success messageDefault: Thanks for contacting us…

Shown after the message is sent. The full default is “Thanks for contacting us. We’ll get back to you as soon as possible.”

VisibilityDefault: Off

Hide on desktop, Hide on mobile, Hide when logged in, Only show when logged in, Schedule publishing. See Settings every block has.

Tips

• Messages go to your store’s customer email (Shopify admin > Settings > General > Store details).
• Want a map and your address next to the form? Use Multi block > Map + Contact + Address to add all three in one click.
• Selling in several languages? Translate the field texts and the success message. See Translate a menu.

Troubleshooting

I'm not getting messages

Check the customer email in your store details and your spam folder. Send the test from the live storefront, not from the editor preview.

An error shows above the fields

Shopify found a problem with the form, for example an invalid email address. The shopper can correct it and send again.

Related pages

• Where do contact form messages go?Where messages sent from the menu's contact form are delivered, and what to check if none arrive.
• NewsletterCollect email signups right from the menu with a short sign-up form.
• Custom HTMLEmbed any HTML in the menu, such as a Google Map or a YouTube video.
• Blocks overviewAdd blocks such as links, images, products and countdowns to a mega menu or tab.

Was this helpful?

Report an issue