How to add input data in subject line of Webflow form submission

Community resources Webflow Tips
1

I’ve seen a few users frustrated that there is no way to have a unique identifier in the subject line of a Webflow form - which means you can’t differentiate between emails in the inbox without opening them.

I’ve come up with a really simple fix to this, which allows you to pull any data from a form and use it in the subject line.

Step 1: Set subject line
Go to site settings > forms
Add {{ formName }} in the subject line box

Step 2: Add your custom code
The custom code for this is some simple JavaScript that replaces the Form Name with your chosen form data. Therefore when the Form Name is sent to your email in the subject line, it is instead replaced with your custom form data.

<script src="https://code.jquery.com/jquery-3.6.0.min.js" integrity="sha256-/xUj+3OJU5yExlq6GSYGSHk7tPXikynS7ogEvDej/m4=" crossorigin="anonymous"></script>

<script>
$("#name").change(function() {
$(this.form).attr("data-name", this.value);
});
</script>

Replace #name with the ID of the input you want displaying on your subject line.

It’s as easy as that - hope it helps

5 Likes
2

FYI: jQuery is already included with Webflow deployments so no need to add it again. Just place dependent code in the before body area.

An alternative is to simply place a hidden field in your form that has a name and value that identifies the source / purpose.

1 Like
3

Hi could you elaborate on your proposed alternative? How exactly should we configure this hidden field? This feature has been requested multiple times on the forum, I sure many would find it extremely useful…

5

Unfortunately this isn’t a solution for the issue described. The data needs to be in the subject line for the necessary filtering and function.

6

@snappercridge - Webflow only lets you define the subject in project settings. The subject line can contain variables which are: siteName , formName like {{siteName}}

So you should be able to filter on the those. If you need dynamic subject lines you should look at a third-party form provider.

7

Sorting the formName by creating multiple forms isn’t always the use case. An example would be a single form that collections the same type of data (first name, last name email, etc, but needs to be sent to a specific email based on a location (like a franchise). Sorting without the aforementioned snippet means multiple forms that would have to dynamically appear based on the selected location.

Third party solutions are great, except they typically cost additional money.

The issue is that Webflow’s form system could be much better with a couple of small tweaks. Something like allowing a data field in the subject (formName.fieldName for example) would be a simple, but powerful addition.

3 Likes
8

Thank you for this. How would you adapt the script to fill the subject with data from two separate fields? Thanks!

9

Thanks! You made my day :grinning:
I was looking for this exact fix and with your code it took me five minutes to solve it.
Appreciate it :pray:

10

Thank you so much for this!

Do you maybe know how I can modify the code so it ads a unique number to the subject line? (So we can follow up on our e-mails more efficient within a team :slight_smile: )

11

I’ve used the solution above, but for every submission, the Webflow creates me another submission data part in the forms tab…

is there another way to do the same thing?

12

Is the ID the field name? Like “Company” or “First Name”??