Custom subject for form email notifications

Support
1

I followed instructions to add a subject field to my netlify forms, to provide a custom subject line in email notifications.

This all works fine for a static string.

However, I’d like to insert the form user’s name (from a form input value) into the subject line.

I’m thinking I’ll have to write some javascript to make this work- but before I do, thought I’d ask if anyone has suggestions?

Is there some variable syntax I can use so that on the netlify side they can inject a value into the subject line string?

1 Like
2

There is no built-in feature at Netlify to affect the subject, beyond the static string that you found. So indeed your supposition that you’d need to do some “magic” client-side to transform that string before submitting is true! I don’t have any handy code to show this so maybe if you come up with some, you could share it here for future folks on the same adventure?

3

+1 vote for a feature that server-side will sub a string variable with an input value, so that something like below, would yield a subject line with the submitter’s email address (or any other input value on the form).

<form .... ..../form>

Email clients like gmail, show messages with the same subject as part of an ongoing conversation, grouping them together. A very easy way to lose inbound leads in inbox clutter. Learned this the hard way with some clients :-). Here’s two test messages, showed as one line in gmail. Easy to miss:

image

I will come back and share any client-side JS I come up with that solves the issue, however. My first thought is that it might be tricky when a user is doing multiple edits and validation cycles prior to submit…

4

Oops, I can see my code example wasn’t escaped properly… this was it:

<form...
<input type="email" name="email>
<input type="text" name="subject" value="{{email}} has sent a message from yourwebsite.com" class="hidden">
.../form>
5

Did you manage to get this working in the end?

If so could you let me know how (not that good at this kind of stuff :slight_smile: )?

6

netlify forms working fine- but I did not develop a method for customising the email subject line with a variable. Where that is important (often)- I continue to use a 3rd party js form service.

7

I managed to get this to work. Added:

<input type="hidden" id="subject" name="subject" value="Default subject">

and then on the relevant controls something like:

<input type="radio" oninput="this.form.element['subject'].value = 'New subject based on input' " ... >

Setting the subject could also be done in a separate .js file, but this way the value can come in from the template (eleventy in my case).

1 Like
8

Here’s my version of what I did to get a custom email notification subject, after seeing @land.jonathan’s solution.

Form:

<input id="input-email" oninput="updateSubject(this.value)" type="email" name="email">
<input id="output-email-subject" type="hidden" name="subject" value="">

And in external js file:

function updateSubject(valEmail) {
document.getElementById("output-email-subject").value = "webform submission from " + valEmail;
}

$(updateSubject());
2 Likes
9

Hi Scott,

Do you mean to say that using this, you were able to completely customize the email subject to remove the pesky [NETLIFY] branding? Because if so, that’s huge - many people have complained about this and there is an ongoing support thread for this here on the community.

Please do respond and let us know.

10

Not to remove the [NETLIFY] branding unfortunately - just to insert a variable string into the message subject, so that each submission doesn’t have an identical subject. Still prefaced by [NETLIFY].

1 Like