In addition to the default contact page template, Turbo includes a Custom Contact page template. The custom contact page template includes a more advanced and customizable contact form.
Additionally, the custom contact page template includes the option to add a banner image at the top, and a map section at the bottom (just like the default contact page template).
Connect Template to Page
In order to use the custom contact page template, the Turbo theme will need to be published. The templates from which you can select are limited to the templates available in your currently published theme.
If you are unable to currently publish your theme and would still like to set up the page.custom-contact template, we have instructions on how to access unpublished templates here.
Open the Pages portion of the Online Store to create a new page (Add page).
Add a Title for the page, then adjust the Theme template to contact-custom.
Save, then open the Themes portion of the Online Store to customize the theme.
Open Template Settings in Theme Editor
Use the page selector to open Pages, then contact-custom.
General Settings for the Template
Click Contact in the left sidebar to open the template's general settings.
Banner image
The template includes an optional Banner feature.
Click Select Image below Banner image to connect an image (1880 x 800px).
Add an alternative image for mobile devices with the Mobile image banner setting.
Select an option for the Mobile image cropping to crop images with a focal point directing to the Left, Center, or Right.
Headings
Add an optional Heading and Subheading with the provided fields.
Contact form image
You can choose to upload an Image for your contact form section. 1024 x 1024px is the recommended image size. The image will display above your subheading and text.
Contact form subheading and text
Within the contact form section, add a Subheading and some Text. This is a great way to add more information for your contact page.
Text position
Adjust the Text position for the text and image to be positioned on the Left or Right side, or above (Center).
Text alignment
Change the Text alignment for your subheading and text to align the text to the Left, Center, or Right.
Show social media icons
Enable Show social media icons to include quick links to your social media accounts (set up in the Social media portion of the Theme settings.
Logo
Pair your Logo with the contact form by clicking Select Image and connecting a 500 x 500px image.
Contact Form Blocks
Build your custom contact form by customizing blocks within the section.
Click the toggle on the left side of the Contact section to reveal the preloaded blocks.
Click one of the blocks to customize it.
To add more text fields or another block, select (+) Add block, then Option, Content, or Text field.
Option
There are three field types included in the Option block: Dropdown, Checkbox, and Radio buttons.
Select the option using the Field type dropdown.
Dropdown and Radio buttons only allow one selection, while Checkbox allows single or multiple selections.
For each of these options, customize the Label using the provided field.
If you're using a dropdown, customize the Placeholder text with the provided field.
Enable the Field is required setting to make the field type mandatory.
Add your options by adding them to the Option 1-6 fields. To use fewer than 6, leave the remaining fields blank.
Content
Use the Content block to include a Logo and Text.
Click Select Image to locate your logo image. Then adjust the Logo display width using the provided slider.
Add Text using the text field.
Text field
The Text field block offers three options: Email, Text area, and Text field.
The Email option allows and requires customers to include their email address with the form submission.
Select Email from Field type, then add your Label and Placeholder using the provided text fields.
Text area
The Text area option provides customers with a larger text field for more detailed messages.
Select Text area from Field type, then add your Label and Placeholder using the provided text fields.
Select Field is required to make this text area mandatory for submission.
Text field
The Text field option provides customers with a text field for more brief information, such as a name, phone number, etc.
Select Text field from Field type, then add your Label and Placeholder using the provided text fields.
Select Field is required to make this text field mandatory for submission.