Custom subject for form email notifications

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

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?

+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…

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>

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: )?

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.

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

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());
1 Like

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.

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].