How to build the quote request form

Last checked against Splash 1.0.0 / 2026-08-15

The quote request form is the Form builder section on your quote page. Every field in it is a block you add in the theme editor, and every answer arrives as an email under the label you typed on that field.

This page covers building the form. The branching logic that makes one field depend on another has its own page, Conditional form fields, and the exact definition of every per-field setting is in the Form field reference.

Requires A page in Shopify admin with the quote theme template assigned, and Quote request page in Theme settings pointed at it. Quote-only products covers that setup. Without the template there is no Form builder section to edit.

Where to work#

Open Online Store, Themes, Customize. In the template picker at the top of the editor choose Pages, then your quote page. The section is called Form builder. Its settings panel holds the seven section settings below, and its block list holds every field.

The theme ships that page with six blocks already in it: Full name, Email, Pool length, Pool width, Project type, and a conditional field called Age of the existing pool. Rename them, reorder them by dragging, or delete them. They are a starting point, not a fixed structure.

You can also add a Form builder section to any other template through Add section. On a page template the section owns the page heading. Everywhere else it renders as an ordinary section with its own heading.

The section settings#

These are the words around the form, none of which are fields.

Add a field#

Use Add block in the section's block list. Ten block types are fields. One is a divider. Three more are not part of the form at all and are covered further down.

Every one of these blocks, the Section break included, also carries the two conditional settings Show when this field and Has one of these answers.

Give every field a label#

The Label does three jobs at once, which is why it is the one setting you cannot skip.

• It is what the visitor reads above the control.
• It is the name the answer arrives under in your notification email. Label a field Pool length and the email line reads Pool length.
• It is the exact string another field must reference to depend on it.

A field with no label does not render on the storefront at all. In the theme editor you see a dashed box in its place reading Give this field a label to show it. On the live store there is nothing there. This is the most common reason a newly added field does not appear.

Two fields sharing a label are separated in the email: the second arrives as Label (2). Square brackets are stripped from the name the answer arrives under, so avoid them in labels.

Fields that are not marked Required print (optional) beside their label. The form marks what is optional rather than what is compulsory, so a form of required fields carries no marks at all. Checkboxes has no Required setting, so its legend always carries (optional).

Help text, placeholders and units#

Note Setting a Unit on a Number field removes the browser's up and down spinner arrows, because they sit in exactly the same place as the unit. The value is still typed or arrow-keyed. A Number field with no unit keeps its spinner.

Lay the fields out#

Width offers Full width or Half width, and it is on Text, Email, Phone, Number, Date and Dropdown. Paragraph text, Multiple choice, Checkboxes, Checkbox and Section break have no Width setting and always run full width.

Half width takes effect from 750px of screen width up. Below that every field is full width, so two half fields stack on a phone. Two half fields pair up only when they are next to each other in the block list. A single half field between two full ones sits alone on its row with an empty space beside it.

Field order on the page is block order in the list. Drag to reorder.

Choice fields#

Dropdown, Multiple choice and Checkboxes each take a Choices box. Write one choice per line. Blank lines are ignored.

New construction
Renovation
Spa or hot tub

The exact text of a line is what the visitor sees, what is submitted to your email, and what another field must match to depend on this one. Editing a choice after you have written a condition against it breaks that condition silently, so change both together.

Dropdown and Multiple choice also offer Select the first choice by default. It starts the field on its first choice instead of empty. On a Dropdown it additionally removes the Select an option prompt row, so there is no way back to an unanswered state.

Turn it on when the field is a branch selector, because then the form is never a blank card and the first branch of questions is already open. Leave it off for an optional question, or you record an answer the visitor never gave.

A single Checkbox submits the word Yes when it is ticked, and nothing when it is not. To write a condition on it, type Checked as the answer. Checkboxes submits every ticked choice under the one label.

Group a long form with section breaks#

A Section break block draws a hairline rule, then a sub-heading under it, with its Help text as a paragraph beneath that. The rule closes off the group above rather than the group the heading introduces. It is not a field: it submits nothing, and no other field can depend on it, because only fields hold answers.

It can itself be conditional, which is the useful part. Give a break the same condition as the group under it and a whole set of questions is introduced by its own heading only after the answer that calls for it.

Always include one Email field that is not conditional#

This is the rule that catches people out, and its failure is silent until someone tries to send a request.

Shopify validates the submission against an email address and uses it as the reply-to on your notification. The theme hands that job to the first Email field on the form that carries no condition. That field's answer arrives as the sender's address rather than as a line of the message. The plain name Email is reserved for it before any block is read, and the Email field itself then claims the next numbered variant and never uses it, so on a form whose Email field is labelled Email a Text field you happen to label Email arrives as Email (3).

A hidden conditional field is disabled and submits nothing. So if every Email field on your form is conditional, and the visitor's answers leave all of them hidden, the submission has no address and Shopify refuses it.

Note The symptom is a red panel above the form reading Your message couldn't be sent. Fix the errors below and try again. with an email error under it, on a form where the visitor never saw an email box. Add one unconditional Email field near the top and it goes away.

Make fields depend on an answer#

Every field block ends with a Conditional visibility group holding two settings: Show when this field takes the Label of another field on the same form, typed exactly, and Has one of these answers takes one answer per line. Fill in both or neither. A field with only one of them filled always shows.

Matching ignores capitalization and surrounding spaces and is otherwise exact. Conditions can nest, and a required field is only enforced while it is actually visible.

The full mechanism, including what a mistyped label looks like in the editor and how deep branches can go, is on Conditional form fields.

Limit A condition only looks at fields in the same Form builder section. It cannot reference a field in a different section, and the quote and contact templates each carry exactly one Form builder section, which is the arrangement the theme is built around.

The column beside the form#

From 990px up the page can run as two columns: a wide reading column on the left and the form as a fixed rail on the right, pinned below the header while the narrative scrolls past it.

That second column only appears once there is something to put in it. Either the page has body content in Shopify admin, or the section holds at least one Contact method, Opening hours or Callout block. With neither, the form is centered alone at 560px wide and does not pin.

Page body content#

Write it in the page's own rich text editor under Online Store, Pages. It renders as the reading column above everything else.

• The first paragraph is set a size larger and in grey, as a lead.
• A numbered list becomes ruled process steps: each item gets its own row between hairlines, led by a monospace numeral in the accent color, numbered 01, 02, 03. Write 1. Share your site and your plans and you get a process step. A bulleted list is left as an ordinary list.

Three blocks that are not fields#

These are added in the same block list as the fields, and the editor marks each one Shown beside the form, not in it. They submit nothing.

Opening hours, one row per line
Monday - Friday | 8:00 - 18:00
Saturday | 10:00 - 16:00
Sunday | Closed

Note These three render in a fixed order relative to the form no matter where you drag them in the block list: page body content first, then every Contact method as one ruled list, then Opening hours and Callout side by side beneath. Within each kind, and between an Opening hours block and a Callout, block order still decides which comes first. Dragging a Contact method between two fields does not move it into the form.

The block limit#

Limit A Form builder section holds 50 blocks in total. Fields, Section breaks, Contact methods, Opening hours and Callouts all count against the same 50. The theme editor stops offering new blocks once you reach it.

What the visitor sees#

On a successful send the form is replaced in place by a confirmation panel inside the same card. The caption, the form heading, every field, the submit button and its fine print all go. What stands there instead is a tick in an accent-tinted disc, the words Request received, your Success message, and a Submit another link back to an empty form.

There is no reference number. Shopify's contact form issues none, and the theme does not invent one. See What Splash never invents.

On a failed send a panel appears above the form reading Your message couldn't be sent. Fix the errors below and try again. followed by Shopify's own error. In practice this is almost always a malformed email address, or the missing address described above.

The form comes back empty apart from the email address. That is the one answer the theme puts back, so every other question has to be retyped. It is the strongest reason to make sure a request cannot fail for a missing address, and a reason not to ask for more than you need.

Test it before you go live#

1. Save in the editor, then open the quote page on the storefront itself, either through the preview link or on the live store. Send a real request rather than testing inside the editor's preview pane.
2. Answer the branch question each way and check that the fields you expect appear, and that nothing you expect to stay hidden shows up.
3. Confirm the notification arrives. The destination is not a theme setting: it is the store's contact address in Shopify admin under Settings. A form that works perfectly sends its answers nowhere useful if that address is wrong or unmonitored.
4. Read the email as a stranger would. Every line is one of your labels. If a line reads Field 3: 32 or Pool length: 32, the label or the unit needs work.

Limit The quote button on a product page carries no information about the product the visitor came from. Every button in the store leads to the same page with the same form. If you need to know what someone was looking at, ask: add a Dropdown listing your services, or a Text field for a model name.

If a request never arrives and the store's contact address is right, get in touch.

Something wrong here If a step does not match what you see, say so and it gets fixed. Documentation goes stale, which is why the line under the title carries a date.