Jump to content
Search In
  • More options...
Find results that contain...
Find results in...
Advanced Search
  • 2

Form Submission, Unique Subject


Captain

Question

Hey everyone,

I ran into a quick issue today that I am looking for a solution to, looking for any input.

I have a form, which sends an email to my gmail. By default forms have a subject line. However when two customers put in the same subject gmail treats them as a conversation. I can turn off conversations, but they're awesome.

What I would like is any way to control the subject line. It could be Contacts Us 03/11/2020 1:43:22 for all I care, it just needs to be unique.

Has anyone come across this before?

Thanks for looking!

Link to comment

19 answers to this question

Recommended Posts

  • 1
27 minutes ago, wpj said:

it's not working properly. When I check the console it says "Can't find variable: $".

The $ not defined usually means jQuery is not installed.

Add the following to Settings > Advanced > Code Injection > HEADER.

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>

Let us know how it goes.

Find my contributions useful? Please like, upvote, mark my answer as best , and see my profile. Thanks for your support!

Link to comment
  • 0

Yes! It's kinda janky but it works and I tested it. 

In your form create a new Text Form Field (the one with the abc rectangle icon or the T icon) and title the field "Subject." Then put in a Placeholder Text of what you want the user to put in this field. Next check the box to make it a Required Field then hit Apply followed by Done. Test it. Please see my attached image for reference.

If you change the name of the Text Form Field to anything else but "Subject" it will just be another Text Form Field and nothing will happen. Adding a Description will not affect it either. However if you receive multiple forms with the same Placeholder Text filled in to the "Subject" Text Form Field, it will still be interpreted in conversation view in Gmail. Try to come up with something in either the Description/Instructions for this field or Placeholder Text to keep the "Subject" unique from other forms.

Your Gmail Subject line will then come in as "Form Submission - [form name] - [placeholder text of Subject text field]

Hope this helps. It was a headache for me too. My site was previously on the 7.0 template and my husband used some CSS/Javascript (forgive me I'm not a web dev) to generate random numbers in the Subject line to make the forms unique. However in 7.1 that feature seems to not be available anymore, or at least not that he could find/figure out.

Screen Shot 2021-04-21 at 10.17.08 PM.png

Edited by Mochi
Link to comment
  • 0

I use a similar method as Mochi, but I use Javascript to autofill the Subject field with a Unix Timestamp giving me a unique number at the end of each subject, then I set the CSS value of the form  Subject field and it's Label to none, making it invisible to the user. The Subject field has to be the first field of the form for this to work, as it has no defining attributes, so this simply modifies the 1st field. Seems to be working so far.

PAGE HEADER CODE INJECTION

<script>
$(document).ready(function(){ 
    var timecode = Date.now();
    var subjecttxt = "#" + timecode;
  
  $('form').find("input[type=text], text").each(function()
  {
      if(!$(this).val()) { 
     $(this).attr("value", subjecttxt);
     $(this).attr("readonly", true);
     $(this).css("display","none");
        var val = subjecttxt;
        return ( val !== subjecttxt );
  }
  });
});

  $(document).ready(function(){ 
$('form').find("label[class=title]").each(function()
  {
      if(!$(this).val()) { 
     $(this).css("display","none");
        var val2 = "none";
        return ( val2 !== "none" );
  }
  });
});  
 </script>

Edited by Ian_A
Missed 1 line
Link to comment
  • 0

@Ian_A Where do you set the CSS value of the subject and label fields? In the Custom CSS editor, or is that supposed to be accomplished with this script? 

I'm not able to get this to work. 

  1. Added new text field and moved to the top field of the form. Set label to "Subject" (also tried leaving blank, text, etc). There is no other/duplicate field in the form labelled Subject. 
  2. Copied script text into the Page Header Code Injunction under Page Settings > Advanced.

I would love to be able to use this for our form. I'm not familiar with javascript or CSS, so this is unknown territory for me. Any help is appreciated. :)

Link to comment
  • 0
15 hours ago, Ian_A said:

The subject field is automatically created when you add a new form. You need to use that original subject field. You can't delete it and try to create your own later. 

Actually that's not true. You can add a Text field with the label 'Subject' to a Form Block at any time and, assuming it is the only field with this label, the contents will be included in the email subject line.

About Paul: Circle Community Leader who values honesty, transparency, respect and appreciation ♥.
Work: Squarespace Expert and founder of 
SF Digital, a company dedicated to improving Squarespace websites by building the features Squarespace didn't include™. See our range of extensions for Squarespace to improve your store.
Content: Links in my posts may refer to SF Digital products or may be affiliate links.

Link to comment
  • 0
On 8/16/2021 at 8:49 PM, Ian_A said:

I use a similar method as Mochi, but I use Javascript to autofill the Subject field with a Unix Timestamp giving me a unique number at the end of each subject, then I set the CSS value of the form  Subject field and it's Label to none, making it invisible to the user. The Subject field has to be the first field of the form for this to work, as it has no defining attributes, so this simply modifies the 1st field. Seems to be working so far.

PAGE HEADER CODE INJECTION

<script>
$(document).ready(function(){ 
    var timecode = Date.now();
    var subjecttxt = "#" + timecode;
  
  $('form').find("input[type=text], text").each(function()
  {
      if(!$(this).val()) { 
     $(this).attr("value", subjecttxt);
     $(this).attr("readonly", true);
     $(this).css("display","none");
        var val = subjecttxt;
        return ( val !== subjecttxt );
  }
  });
});

  $(document).ready(function(){ 
$('form').find("label[class=title]").each(function()
  {
      if(!$(this).val()) { 
     $(this).css("display","none");
        var val2 = "none";
        return ( val2 !== "none" );
  }
  });
});  
 </script>

I don't suppose you have time to write a dummies guide to this? I'm basic level computer literate. Your suggestion sounds EXACTLY what I need but I have no idea how to achieve it! For now I've used Mochi's solution but if possible I'd like to use your solution so that its less reliant on the customer filling in the form correctly. Thank you!

Link to comment
  • 0
On 8/16/2021 at 2:49 PM, Ian_A said:

I use a similar method as Mochi, but I use Javascript to autofill the Subject field with a Unix Timestamp giving me a unique number at the end of each subject, then I set the CSS value of the form  Subject field and it's Label to none, making it invisible to the user. The Subject field has to be the first field of the form for this to work, as it has no defining attributes, so this simply modifies the 1st field. Seems to be working so far.

PAGE HEADER CODE INJECTION

<script>
$(document).ready(function(){ 
    var timecode = Date.now();
    var subjecttxt = "#" + timecode;
  
  $('form').find("input[type=text], text").each(function()
  {
      if(!$(this).val()) { 
     $(this).attr("value", subjecttxt);
     $(this).attr("readonly", true);
     $(this).css("display","none");
        var val = subjecttxt;
        return ( val !== subjecttxt );
  }
  });
});

  $(document).ready(function(){ 
$('form').find("label[class=title]").each(function()
  {
      if(!$(this).val()) { 
     $(this).css("display","none");
        var val2 = "none";
        return ( val2 !== "none" );
  }
  });
});  
 </script>

Hi Ian_A,

Would you be able to help walk me through how to input this correctly? I am having the same troubles as Jenny_M and would love to get this to work!

Link to comment
  • 0
1 hour ago, TheMissingPastry said:

Hi Ian_A,

Would you be able to help walk me through how to input this correctly? I am having the same troubles as Jenny_M and would love to get this to work!

@TheMissingPastry 

1. Put a form on the page.

2. Edit the order of the form fields to put the subject field at the very top.

3. Save your changes. 

4. Go to Page Settings > Advanced for the page with the form on it and paste all of the code from <script> to </script> into the page header code injection area. 
 

That’s it. You should see the subject field when editing the page, but not when viewing it as a user. Submit a test of your form and it should have a unique # at the end now. 

Link to comment
  • 0

@Ian_A — thanks for this solution! I've tried implementing it, but it's not working properly. When I check the console it says "Can't find variable: $".

 

Here's the code in full I used:

<script>
  $(document).ready(function(){ 
    var timecode = Date.now();
    var subjecttxt = "#" + timecode;
  
  $('form').find("input[type=text], text").each(function()
  {
      if(!$(this).val()) { 
     $(this).attr("value", subjecttxt);
     $(this).attr("readonly", true);
     $(this).css("display","none");
        var val = subjecttxt;
        return ( val !== subjecttxt );
  }
  });
});

  $(document).ready(function(){ 
$('form').find("label[class=title]").each(function()
  {
      if(!$(this).val()) { 
     $(this).css("display","none");
        var val2 = "none";
        return ( val2 !== "none" );
  }
  });
});  
 </script>

Is this still working on your end? Any thoughts would be much appreciated, thank you.

Link to comment
  • 0
On 2/12/2022 at 9:44 PM, wpj said:

@Ian_A — thanks for this solution! I've tried implementing it, but it's not working properly. When I check the console it says "Can't find variable: $".

 

Here's the code in full I used:

<script>
  $(document).ready(function(){ 
    var timecode = Date.now();
    var subjecttxt = "#" + timecode;
  
  $('form').find("input[type=text], text").each(function()
  {
      if(!$(this).val()) { 
     $(this).attr("value", subjecttxt);
     $(this).attr("readonly", true);
     $(this).css("display","none");
        var val = subjecttxt;
        return ( val !== subjecttxt );
  }
  });
});

  $(document).ready(function(){ 
$('form').find("label[class=title]").each(function()
  {
      if(!$(this).val()) { 
     $(this).css("display","none");
        var val2 = "none";
        return ( val2 !== "none" );
  }
  });
});  
 </script>

Is this still working on your end? Any thoughts would be much appreciated, thank you.

set this line line first

 

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js" type="text/javascript"></script>

 

Link to comment
  • 0
On 1/22/2022 at 7:20 PM, Ian_A said:

@TheMissingPastry 

1. Put a form on the page.

2. Edit the order of the form fields to put the subject field at the very top.

3. Save your changes. 

4. Go to Page Settings > Advanced for the page with the form on it and paste all of the code from <script> to </script> into the page header code injection area. 
 

That’s it. You should see the subject field when editing the page, but not when viewing it as a user. Submit a test of your form and it should have a unique # at the end now. 

For me it is coming in the body but not on the subject

Link to comment

Create an account or sign in to comment

You need to be a member in order to leave a comment

×
×
  • Create New...