Contact page
An alternate page template, page.contact.json, using the Contact form section built for it: a form on one side, your contact details on the other.
To use it, create a page in Shopify admin > Content > Pages and set its Theme template to contact. The page’s title becomes the heading. The page’s body is not shown; the Description setting below takes its place.
Two sections in the editor are called Contact form. This one belongs to the contact template and carries the details panel. The other is a Contact form section you can add to any page, which is just the form. The Contact and stores and FAQ page templates use that one.
Section settings
- Show back link and breadcrumb. A back link and a
Home / <page title>breadcrumb above the heading. The back link returns to the previous page in your store. Default: on.
Header
- Show subheading. Default: on.
- Subheading. Default:
Get in touch. - Show description. Default: on.
- Description. Default:
We'd love to hear from you. Send us a message and we'll respond as soon as possible.
Contact details
The panel beside the form. Each line can be hidden: the ones with a Show switch show their text fields in the editor only while the switch is on, and the phone number hides when left blank.
- Show email. Default: on.
- Email address. Default:
hello@yourstore.com. Change this before launch. - Email label. Default:
Email. - Show location. Default: on.
- Location. Default:
City, Country. Change this before launch. - Location label. Default:
Location. - Phone number (display). A clickable phone number in the info panel. Leave blank to hide.
- Show response time. Default: on.
- Response time. Empty by default. For example,
Within 2 business days. - Response time label. Default:
Response time. - Show trust message. Default: on.
- Trust message. Shown below the contact details. Leave blank to hide.
Form
- Show phone field. Default: on.
- Phone field label. Default:
Phone. - Subject options. One option per line. The form shows a Subject dropdown built from these. Leave blank to hide the dropdown. Defaults: General inquiry, Order support, Press and media, Wholesale, Careers.
- Privacy reassurance. Small text below the submit button. Leave blank to hide.
Colors
- Color scheme. Default: scheme-1.
Spacing
- Top padding / Bottom padding. Range: 0 to 300 px in 5 px steps. Default: 95 px top and 55 px bottom. This is the padding on screens 1920 px and wider; it scales down on smaller screens.
The form
The form asks for a name, an email address and a message, plus a phone number when Show phone field is on and a subject when Subject options has at least one line. The email address and the message are required. Name and email sit side by side where the card is wide enough, and stack on phones. These are the same fields as the Contact form section, so every contact form in the store looks alike. If a submission is turned away, the reason shows under the email field, with the email and message the shopper typed kept in place.
Where messages go
Submissions arrive by email at the address in Shopify admin > Settings > Store details > Sender email, not at the address shown on the page. Those are two different things, and it is worth checking the first one actually reaches someone.
The form is protected by Shopify’s own spam check, which can ask a shopper to confirm they’re human before the message sends.
Tips
- Replace the placeholder details.
hello@yourstore.comandCity, Countryship as examples and will go live if you leave them. - Only promise a response time you can keep. An unanswered promise on the contact page generates more mail, not less.
- Trim the subject options to the ones you actually route differently. Five choices where two would do makes the form feel longer than it is.
- Some markets require a business address on the storefront. If yours does, the location line here and a Contact block in the Footer are the two conventional places for it.