Submissions and FlowSend a confirmation email when a form is submitted

Send a confirmation email when a form is submitted

Copy page

A Shopify Flow workflow that emails the visitor a confirmation with their own message after they submit a Workflow Forms form, using Workflow Transactional Email. With the .flow file to import.

A visitor fills in your contact form and gets an email a moment later: we received your message, with the message they wrote quoted back. This article builds that workflow in Shopify Flow, step by step, and offers the finished workflow as a file to import.

What you need

  • Workflow Forms with a form that has an Email field (the trigger's Email variable is the first email field of the form).
  • Shopify Flow.
  • An app that adds a send email to anyone action to Flow. Flow's own Send internal email only reaches your staff. This article uses our Workflow Transactional Email with a connected Microsoft 365, Google or SMTP sender.

The workflow

Step Setting Value
Trigger Form submitted (Workflow Forms) no configuration
Action Send Transactional Email (Workflow Transactional Email) see below

The trigger starts for every form. Add a condition on Form handle between the two steps if only one form should send this email.

The Send Transactional Email step

Field Value
To Email(s) {{ email }}
Variables (JSON) see the code below
Config page (Configure Email) your sender and the layout Thanks for your message
Variables (JSON)json
{"form_title": "{{ formTitle }}", "data": {{ data }}}

{{ data }} is written without quotes: the trigger's Data variable is already JSON, so it becomes a nested object and the layout can read every field by its handle, for example variables.data.message. This is the easiest way to get a single submitted value into an email; no Run code step is needed.

The email layout

In Workflow Transactional Email, create a transactional layout (text editor is enough) and select it on the step's config page together with a sender:

Setting Value
Name Thanks for your message
Subject We received your message{% if variables.data.subject %}: {{ variables.data.subject }}{% endif %}
Preview text Thanks, we will get back to you shortly.
Bodyxml
<p>Hi {{ variables.data.name | default: "there" }},</p>
<p>thanks for getting in touch through our <strong>{{ variables.form_title }}</strong> form. We received your message and will get back to you shortly.</p>
{% if variables.data.subject %}<p><em>Subject:</em> {{ variables.data.subject }}</p>{% endif %}
<p><em>Your message:</em><br>{{ variables.data.message | newline_to_br }}</p>
<p>Kind regards<br>{{ shop.name }}</p>

name, subject and message are the field handles of the form (Fields and the field library shows them). Rename them in the body if your form uses other handles. A field the form does not have, or a field hidden by a condition, is simply empty; the default filter and the {% if %} take care of that.

Import the workflow instead

The file below is this workflow exported from Shopify Flow.

  1. In Shopify Flow, click Import and choose the .flow file.
  2. Open the Send Transactional Email step, click Configure Email and pick your sender and layout. The file carries the fields of the step, not your sender and layout, so this is always needed once.
  3. Turn on the workflow.

Test it

Send your form once on your storefront (the editor's Test like a visitor mode sends nothing to Flow). The run appears in Shopify Flow under Recent runs, the email in Workflow Transactional Email's History, with the variables the step received. Both apps keep the visitor's address out of their logs.

Good to know

  • Reply-To: set the step's Reply-To to your support address so a reply to the confirmation lands with your team.
  • Language: the trigger's Locale variable is the storefront language the form was filled in. Put {{ locale }} into the step's Language field and the layout's translation in that language is sent, when it has one.
  • Consent: a confirmation about the visitor's own message is transactional. Do not add newsletter content to it; Marketing consent tells you whether the visitor opted in, subscribing them is a separate step.

Next steps