We know a lot of users have NetSuite as their back office system but might not have a SuiteCommerce website, therefore, passing data between the website and their NetSuite system isn’t natively connected. There are many benefits to integrating contact forms with NetSuite and saves on manually copying over the data or losing details of those who do get in touch.
The easiest way to do this is to create a contact form in NetSuite and add it to your website via an iframe, however, this method doesn’t look very pleasing on the website, can be blocked from the user’s end and takes an age to load. Doing this can lead to potential prospects or customers missing the contact form or leaving before it loads.
Creating a campaign
Before creating a contact form in NetSuite or in your website, we need to create a campaign in order to identify and allocate each record created. We use several campaigns to help identify where our contacts come from, be it a campaign for the contact page, our marketing efforts and for each of our NetSuite pages to help better identify what our audience is looking for. Throughout this blog, we will a contact form specifically for this page and go through each step, so first we need to navigate to Campaigns > Marketing > Campaigns > New
From here we need to fill out the relevant fields to match the campaign. The most important field is the Title field which is what the campaign will be called. For this, you want to enter your campaign and in the URL field input the URL where the contact form will sit. You can enter an end date should the campaign be for a limited period of time or if the contact form is to be used in a paid marketing campaign, you can also enter a Base Cost and Expected Revenue to help keep ontop of financial KPI’s.
You should have something that looks close to the above.
Creating a response email
Once we have the campaign set up, we need to create a response email to automatically reply to a user once a contact form has been filled in. We have previously written about this in our NetSuite tips: Sending emails from NetSuite post which covers the topic in more detail, however, we will go over this briefly now.
Navigating to Documents > Templates > Email Templates > New you can create a response email letting your audience know their contact submission has been successfully received. This is a great opportunity to offer something unique to your audience such as a downloadable, a discount code or cross-sell something of relevance.
Creating an Online Customer Form
Navigate to Campaigns > Marketing > Online Customer Forms > New
When creating a contact form, I always go for Default Form Template, simply because the HTML and CSS/Styling comes manually later on. From here you will be greeted with a blank page and two fields already created Channel Tier and Subsidiary. Enter the title you wish to call your contact form, the Message field isn’t needed as again, the user will never see the contact form but instead will see the one we create a little later on.
In the select fields tab, go ahead and create the fields you wish to gather information on for your contact form. For this example, I have created First Name, Last Name, Email, Comments and Subscriptions to replicate a pretty standard contact form layout. If you require more information you can always input other fields and gather data such industry, phone number or any custom field you have created. It’s worth noting that one of Company, First Name or Last Name will need to be made manditory in order for the contact form to work.
The Subscriptions field is very important for UK based business as it needs to comply with GDPR laws and give users a transparent overview of how their data is used. Once complete you should have something that looks like this;
If you’re happy with the fields of your contact form, navigate to the Set Up Workflow tab. Here you can set up what happens once the contact form has been filled in and can select an auto-reply email which we created earlier. A lot of the information you input here will be down to your own preferences but for this, we will set the lead status to Unqualified and set the Lead Source to the campaign we created at the start of this blog post so we can associate all those who fill in this contact form with the relevant campaign.
If you have multiple subsidiaries you can select the one relevant to your campaign and also create a redirect once the form has been filled in. As we’re passing the data through this form via a HTML form we’re creating later, this redirect is very important and will send the user to the page you select once completed.
In the Customer Notification section, the Send Auto-Reply Email should be the one we created earlier. You can also set up notification emails for staff or your sales team, this will notify them of a new lead which has been created but can also be used for creating support tickets, notifying accounts or whatever you find relevant.
You can see from the above image how we have set the redirect back to this blog post and selected everything we have already created. Once you’re happy, hit save and your Online Customer Form should be done.
Once saved you will be taken to the Online Customer Form. From here click the External tab and make a note of the URL under PUBLISHABLE FORM URL. Be sure to copy the URL from this page by selecting it and copying, opening the link can change the URL at times.
Once copied and saved, you can open the link and take a look at the contact form.
Creating our HTML contact form
Now we get to create our contact form which is what will be used for the website. For the one we’re creating, we’re going to start with a very basic HTML template which is;
[php]
<form id=”myform” action=”ENTER YOUR PUBLISHABLE URL HERE” method=”post”>
<label>First Name*</label>
<input name=”firstname” type=”text” />
<label>Last Name*</label>
<input name=”lastname” type=”text” />
<label>Email</label>
<input name=”email” type=”text” />
<label>Comments</label>
<textarea name=”comments” placeholder=”Comments”></textarea>
<input class=”button” name=”submitter” type=”submit” value=”submit” />
</form>
[/php]
And that displays;
As you can see in the HTML code, the action=”” needs to be the publishable link from your online contact form in order for it to push the contact form through to NetSuite. Here is the important part of integrating the forms;
from the publishable URL of the Online Customer Form we need to inspect each field either by the Inspect Element tool or by manually searching the source code. From there we can find what each fields ID is and then this is copied across to our contact form. For example, in the above image the First Name field is id=”firstname_fs” which we replicate for our First Name field in the code below
[php]
<label>First Name</label>
<input id=”firstname_fs” name=”firstname” type=”text” />
[/php]
Once you have all your fields and allocated the correct ID to each, the final thing to add would be the subscriptions options for GDPR compliance. This is a bit difficult as they’re all in a box in the NetSuite contact form so we need to break them down and turn them into checkboxes. We use the following code to allocate a checkbox to each relevant Subscriptions field;
[php]
<input id=”subscriptions_fs” name=”subscriptions” type=”checkbox” value=”4″ /> Newsletters
<input id=”subscriptions_fs” style=”margin-left: 10px;” name=”subscriptions” type=”checkbox” value=”5″ /> Product Updates
<input id=”subscriptions_fs” style=”margin-left: 10px;” name=”subscriptions” type=”checkbox” value=”1″ /> Marketing Communications
[/php]
And this displays;
Newsletters
Product Updates
Marketing Communications
The “subscriptions_fs” relates to the subscriptions box in the NetSuite Customer Form and each value represents one of the selectable options.
With all of your fields matched up to the ones in NetSuite, you can focus on the CSS and styling of your contact form. Here’s ours;[/vc_column_text][vc_raw_html css=”.vc_custom_1541600304727{border-top-width: 2px !important;border-right-width: 2px !important;border-bottom-width: 2px !important;border-left-width: 2px !important;padding-top: 20px !important;padding-bottom: 20px !important;padding-left: 10px !important;background-color: #dddddd !important;border-left-color: #bababa !important;border-left-style: solid !important;border-right-color: #bababa !important;border-right-style: solid !important;border-top-color: #bababa !important;border-top-style: solid !important;border-bottom-color: #bababa !important;border-bottom-style: solid !important;}”]JTNDZm9ybSUyMGlkJTNEJTIybXlmb3JtJTIyJTIwYWN0aW9uJTNEJTIyaHR0cHMlM0ElMkYlMkZmb3Jtcy5ldTIubmV0c3VpdGUuY29tJTJGYXBwJTJGc2l0ZSUyRmNybSUyRmV4dGVybmFsbGVhZHBhZ2UubmwlM0Zjb21waWQlM0QxMTcwOTk3JTI2YW1wJTNCZm9ybWlkJTNENTQlMjZhbXAlM0JoJTNEQUFDZmZodF9uQmkzT3h2QTdJM2dPU2tzclMtMG4wOGNudTglMjIlMjBtZXRob2QlM0QlMjJwb3N0JTIyJTNFJTBBJTNDZGl2JTIwY2xhc3MlM0QlMjJjb250ZW50LWNvbHVtbiUyMG9uZV9oYWxmJTIyJTNFJTNDaW5wdXQlMjBpZCUzRCUyMmZpcnN0bmFtZV9mcyUyMiUyMGNsYXNzJTNEJTIyaW5wdXRyZXElMjIlMjBzdHlsZSUzRCUyMm1heC13aWR0aCUzQSUyMDk1JTI1JTNCJTIyJTIwbmFtZSUzRCUyMmZpcnN0bmFtZSUyMiUyMHJlcXVpcmVkJTNEJTIyJTIyJTIwdHlwZSUzRCUyMnRleHQlMjIlMjBwbGFjZWhvbGRlciUzRCUyMkZpcnN0JTIwTmFtZSUyMiUyMCUyRiUzRSUzQyUyRmRpdiUzRSUwQSUzQ2RpdiUyMGNsYXNzJTNEJTIyY29udGVudC1jb2x1bW4lMjBvbmVfaGFsZiUyMGxhc3RfY29sdW1uJTIyJTNFJTNDaW5wdXQlMjBpZCUzRCUyMmxhc3RuYW1lX2ZzJTIyJTIwY2xhc3MlM0QlMjJpbnB1dHJlcSUyMiUyMG5hbWUlM0QlMjJsYXN0bmFtZSUyMiUyMHJlcXVpcmVkJTNEJTIyJTIyJTIwdHlwZSUzRCUyMnRleHQlMjIlMjBwbGFjZWhvbGRlciUzRCUyMkxhc3QlMjBOYW1lJTIyJTIwJTJGJTNFJTNDJTJGZGl2JTNFJTBBJTNDaW5wdXQlMjBpZCUzRCUyMmVtYWlsX2ZzJTIyJTIwbmFtZSUzRCUyMmVtYWlsJTIyJTIwcmVxdWlyZWQlM0QlMjIlMjIlMjB0eXBlJTNEJTIydGV4dCUyMiUyMHBsYWNlaG9sZGVyJTNEJTIyRW1haWwlMjIlMjAlMkYlM0UlMEElM0N0ZXh0YXJlYSUyMGlkJTNEJTIyY29tbWVudHNfZnMlMjIlMjBuYW1lJTNEJTIyY29tbWVudHMlMjIlMjBwbGFjZWhvbGRlciUzRCUyMkNvbW1lbnRzJTIyJTNFJTNDJTJGdGV4dGFyZWElM0UlMEElM0NoNSUzRVByaXZhY3klMjBQb2xpY3klMjBBZ3JlZW1lbnQlM0MlMkZoNSUzRSUwQSUzQ2lucHV0JTIwcmVxdWlyZWQlM0QlMjIlMjIlMjB0eXBlJTNEJTIyY2hlY2tib3glMjIlMjAlMkYlM0VCeSUyMGNoZWNraW5nJTIwdGhpcyUyMHlvdSUyMGFja25vd2xlZGdlJTIwTm9CbHVlJTIwTHRkJTIwbWF5JTIwY29sbGVjdCUyMGFueSUyMGluZm9ybWF0aW9uJTIwaW5wdXQlMjBpbiUyMHRoaXMlMjBmb3JtJTIwdG8lMjBoZWxwJTIwdXMlMjBjb250YWN0JTIweW91JTIwcmVnYXJkaW5nJTIweW91ciUyMHF1ZXJ5LiUyMFBsZWFzZSUyMGZlZWwlMjBmcmVlJTIwdG8lMjByZXZpZXclMjBvdXIlMjAlM0NhJTIwaHJlZiUzRCUyMmh0dHBzJTNBJTJGJTJGbm9ibHVlLmNvLnVrJTJGcHJpdmFjeS1wb2xpY3klMjIlMjB0YXJnZXQlM0QlMjJfYmxhbmslMjIlMjByZWwlM0QlMjJub29wZW5lciUyMiUzRXByaXZhY3klMjBwb2xpY3klM0MlMkZhJTNFJTIwZm9yJTIwbW9yZSUyMGluZm9ybWF0aW9uLiUwQSUzQ2g1JTNFQ29tbXVuaWNhdGlvbnMlM0MlMkZoNSUzRSUwQSUzQ2klM0VQbGVhc2UlMjBjaGVjayUyMHRoZSUyMGJveCUyMGJlbG93JTIwaWYlMjB5b3UlMjB3b3VsZCUyMGxpa2UlMjB0byUyMHJlY2lldmUlMjBOb0JsdWUlMjdzLi4uJTNDJTJGaSUzRSUwQSUzQ2JyJTNFJTBBJTNDaW5wdXQlMjBpZCUzRCUyMnN1YnNjcmlwdGlvbnNfZnMlMjIlMjBuYW1lJTNEJTIyc3Vic2NyaXB0aW9ucyUyMiUyMHR5cGUlM0QlMjJjaGVja2JveCUyMiUyMHZhbHVlJTNEJTIyNCUyMiUyMCUyRiUzRSUyME5ld3NsZXR0ZXJzJTIwJTNDaW5wdXQlMjBpZCUzRCUyMnN1YnNjcmlwdGlvbnNfZnMlMjIlMjBzdHlsZSUzRCUyMm1hcmdpbi1sZWZ0JTNBJTIwMTBweCUzQiUyMiUyMG5hbWUlM0QlMjJzdWJzY3JpcHRpb25zJTIyJTIwdHlwZSUzRCUyMmNoZWNrYm94JTIyJTIwdmFsdWUlM0QlMjI1JTIyJTIwJTJGJTNFJTIwUHJvZHVjdCUyMFVwZGF0ZXMlMjAlM0NpbnB1dCUyMGlkJTNEJTIyc3Vic2NyaXB0aW9uc19mcyUyMiUyMHN0eWxlJTNEJTIybWFyZ2luLWxlZnQlM0ElMjAxMHB4JTNCJTIyJTIwbmFtZSUzRCUyMnN1YnNjcmlwdGlvbnMlMjIlMjB0eXBlJTNEJTIyY2hlY2tib3glMjIlMjB2YWx1ZSUzRCUyMjElMjIlMjAlMkYlM0UlMjBNYXJrZXRpbmclMjBDb21tdW5pY2F0aW9ucyUwQSUzQ2RpdiUyMGNsYXNzJTNEJTIyZy1yZWNhcHRjaGElMjIlMjBkYXRhLXNpdGVrZXklM0QlMjI2TGZCLW5JVUFBQUFBTkgwMFRUMHlteUZEbDFKdURpTXJGdHk4ckdYJTIyJTNFJTNDJTJGZGl2JTNFJTBBJTNDaW5wdXQlMjBpZCUzRCUyMnN1Ym1pdHRlciUyMiUyMGNsYXNzJTNEJTIyYnV0dG9uJTIyJTIwbmFtZSUzRCUyMnN1Ym1pdHRlciUyMiUyMHR5cGUlM0QlMjJzdWJtaXQlMjIlMjB2YWx1ZSUzRCUyMnN1Ym1pdCUyMiUyMCUyRiUzRSUwQSUzQyUyRmZvcm0lM0U=[/vc_raw_html][vc_column_text]
Finishing Up
Once your contact form is live and sending data between your website and your NetSuite back office, you can start plan marketing activities a lot better and not have the aches and pains of manual data input. This, of course, can stretch a lot further than a simple contact form and can be used for logging support cases of your customers, updating a customers preferences or information, used for surveys and so on.
If you’re struggling to create a contact form and would like support or further training on how to do so, please feel free to get in touch or visit our NetSuite Training and Support page for more. Also, leave a comment with your integrated NetSuite forms, we’d love to view more examples of this and see some creative uses for them.
[/vc_column_text][/vc_column][/vc_row]
