Make it possible for Hubspot Forms to separate First/Last Name from one Field
We've read that customers find it easier to interact with one field for name, rather than two (First Name, Last Name). Conversions are more likely with one name field, rather than two, seperate fields for First and Last Name.
I'd like Hubspot Forms to separate First/Last Name from one Name Field. In other words, if a customer fills in their First and Last Name with one Form Field, Hubspot should separate the First and Last Names when creating a contact.
This will help all Hubspot customers convert site visitors at a higher rate. Thanks for understanding!
Makes sense. In the meantime, you may use one field for name in your forms that populates a custom property „full name“ which you create if not available already.
I would then export the forms info into excel and perform a transform to table using a space as the delimiter to split the full name into separate cells.
Name the first „First name“ and the second (or 3rd depending on the name) „Last name“.
I would then import the contacts to update the existing ones which came in with full name.
When exporting contact information, the contact ID is available. Make sure you don’t delete or modify this information to update the contact.
I haven’t tested it yet (just saw your note, replied on iPhone:-) but you can give it a try with some test contacts. Please let me know if all worked the way it should since I‘d adapt it here, too, if it works.
I'm not sure if this has already been resolved elsewhere... but i've written a little bit of scripting that achieves just this... It's also accounting for various prefixes for last names (Mc, Mac, Von, etc.).
Basically, what i've done is created a first, middle and last name field and hidden them within the forms, then added an onsubmit callback that processes the full name and splits it up into the first / middle / last properties. So far it seems to be working rather well...
The code for splitting the name...
function capitalizeFirstLetter(str) {
return str.charAt(0).toUpperCase() + str.slice(1);
}
function checkPrefixes(str, arr){
for(var i = 0; i < arr.length; i++)
if (str.toLowerCase() === arr[i].toLowerCase()){
return true;
}
return false;
}
function separateNames($form){
var namePrefixes, fullName, splitName, user;
namePrefixes = ["Ab","Af","Ap","Abu","Aït","Al","Ālam","Aust","Austre","Bar","Bath","bat","Ben","bin","ibn","Bet","Bint","Da","Das","De","Degli","Dele","Del","Della","Der","Di","Dos","Du","El","Fetch","Vetch","Fitz","Kil","Gil","La","Le","Lille","Lu","Mac","Mc","Mck","Mhic","Mic","Mala","Mellom","Myljom","Na","Ned","Nedre","Neder","Nic","Ni","Nin","Nord","Norr","Ny","Ua","Ui","Opp","Upp","Öfver","Ost","Öst","Öster","Øst","Øst","Østre","Över","Øvste","Øvre","Øver","Öz","Pour","Stor","Söder","Ter","Ter","Tre","Van","Väst","Väster","Verch","Erch","Vest","Vesle","Vetle","von","zu"];
user = {
firstName: '',
middleName: '',
lastName: ''
}
console.log('maybe.....' + user);
fullName = $form.find('input[name="full_name"]').val();
fullName = fullName.replace(/\s+/g, ' ').trim();
splitName = fullName.split(" ");
console.log('we found the field value!!');
if(splitName.length === 1){
user.firstName = splitName[0];
}
if (splitName.length === 2) {
user.firstName = splitName[0];
user.lastName = splitName[1];
}
if (splitName.length === 3) {
user.firstName = splitName[0];
user.middleName = splitName[1];
user.lastName = splitName[2];
}
if (splitName.length >= 4){
user.firstName = splitName[0];
for (var i = 1; i < splitName.length; i++){
if (checkPrefixes(splitName[i], namePrefixes) === false && i !== (splitName.length - 1) && user.lastName === ""){
user.middleName += splitName[i] + " ";
}
else {
user.lastName += splitName[i] + " ";
}
}
}
if (user.middleName.length < 3 && user.middleName.indexOf('.') !== -1) {
user.lastName = user.middleName + user.lastName;
user.middleName = '';
}
user.firstName = capitalizeFirstLetter(user.firstName);
user.middleName = capitalizeFirstLetter(user.middleName);
user.lastName = capitalizeFirstLetter(user.lastName);
console.log("the full name is ... \n First: " + user.firstName + "\n Middle: " + user.middleName+ "\n Last: " + user.lastName);
return user;
}
function injectFieldData(el, data){
var inputField = document.querySelector(el) || null;
if(inputField !== null){
if(data !== undefined){
inputField.value = data;
}
}
}
function postFormSubmission($form){
var user = separateNames($form);
console.log(user);
$form.find('input[name="firstname"]').val(user.firstName).change();
$form.find('input[name="middlename"]').val(user.middleName).change();
$form.find('input[name="lastname"]').val(user.lastName).change();
}
and then when you are creating a form, via the api, pass in the onFormSubmit...
My name is Joe, I'm the Ideas Forum Manager. I've been in contact with the HubSpot product team about this Idea, and I wanted to provide a quick update.
We appreciate all the feedback you’ve shared here to help our team evaluate this feature request. However, at this time, this functionality is not something our team is planning to build into HubSpot. This is certainly subject to change in the future, so feel free to leave feedback if you'd like. We'll update this thread if our plans change.
Here is a fix that does not require knowledge of code! [You will need to use Zapier]
1. I created a contact property "Name" in Hubspot Contacts. So the user will enter First & Last Name in one "Name" field in all my forms.
2. When a New Contact is created in Hubspot, Zapier will be triggered to retrieve the new contact's properties, including the "Name" property I created in [1].
3. I then run a Filter step which looks for new contacts for which the "First Name" and "Last Name" properties DO NOT EXIST, but the "Name" property exists. In the image below, the first two properties are the "First Name and Last Name" properties. The last property is the "Name" property I created in the first step.
4. Next, I then use the Formatter by Zappier app to split the "Name" property entry into two separate fields which are both returned after splitting. These will be used later to update the "First Name" and "Last Name" properties of the same contact.
5. Now to update our contact! Add the action "Create or Update Contact in Hubspot".
To update a contact, make sure to update the "contact information: email address" and "contact information: Name" properties with the data you retrieved in Step 1. This will prevent creating a second contact but will just update the existing contact instead. Just showing the email example only below.
6. Use the fields returned from Step 4 by the Formatter to populate the First Name and Last Name properties of your contact!
Just to add something quite interesting - in the Chatflow module you can use the full name property called "Contact Name" and HubSpot will automatically split into first and last name for you. I've tested and it works perfectly. So this is already in place for chatflow properties - seems a fairly small step to extend this to the forms module.
At least in reporting, it would be great to be able to simply use the contact's name as a single contact property for developing tables & reports. As we've seen in the chat platform (and elsewhere in HubSpot), there is an internal contact property "Contact Name" which combines the First & Last name of the contact, so I would assume implementing it elsewhere would be relatively quick.
You must be a registered user to add a comment. If you've already registered, sign in. Otherwise, register and sign in.
