Legacy Smart Form Builder Overview
About Legacy Smart Forms
Note: This article covers our older legacy Smart Forms. For modern, mobile responsive ONTRAforms please see our articles on ONTRAforms and ONTRApages.
Applies to: All ONTRAPORT accounts.
ONTRAPORT allows you to create very sophisticated web forms that you can quickly add to your website. What makes our forms ‘smart’ is that they can be set up to add items such as Tags to the contact as soon as he or she clicks submit or even drop them right into your predesigned marketing sequences, fire rules based on field fill-outs, send them to a designated thank you page based on field fill-outs, show/hide fields based on field fill-outs, or route them to someone on your team of salespeople, automatically.
Forms are essential in capturing contact info from your web visitors that will allow you to keep in touch with them over time. The most common use for SmartForms is to give people a way to opt-in for more information from you, but there are many more uses.
How to Create a Basic Legacy Smart Form
Create a Legacy Smart Form
- Click on Campaigns > Forms
- Click the + New Form button
- Select Smart Form
- Add your fields
- Click on a field and make sure the Field Settings tab is selected
- Adjust your Field Settings for each field
- Required Checkbox: Checking this checkbox means that your contacts must fill out the selected field before submitting it. We recommend checking the required checkbox on the email address field and first name field.
- Field Label: This is the name of the field as it appears on the form. The field name will appear as it was created in your database, but the SmartForm will appear as listed in the Field Label section.
- Place your fields in the order you’d like them by clicking and dragging them into your desired location.
Style your form
- Field Style Basics: After clicking on a field, the ‘Form Style’ tab is where you can style your form to your heart’s content. This is much like any word processing toolbar that allows you to adjust font type, size, color, etc. The information below includes the basics!
- Font Family: This adjusts the type of font used on your field labels.
- Font Size: This adjusts the size of the font.
- Font Color: This adjusts the field label color. Use the slidebar on the right to select a color range and the small circle to adjust exact color. You can also enter hex colors in the text box.
- Text Style: This adjusts the style of the field labels including bold, italic, and underline.
- Click the Background tab to modify the background of your form.
- Click the Background tab to modify the background of your form and select your desired look from the Border Style pulldown menu.
- Adjust Form Size: You can adjust the width of your form by using the left/right arrows to the right of your form.
- Background Color: This section allows you to modify the background.
- Border Transparent or Color: This section allows you to add/remove a border around your form.
Modify Your Settings
- This section handles all the backend operations and the ‘automagic’ of your smart form including your opt-in settings, thank you page, tags, sequences, rules, and form fill out notifications. To navigate to it, click the Settings Tab.
- Opt-In: We have three opt-in settings available – Double Opt-In Required, Double Opt-In Optional and Single. Select the radio button on the option you’d prefer.
- Thank You Page: This is the page that contacts will see after they fill out the form. You can use our default thank you page, a landing page you’ve built in our landing pages editor or your own custom URL that you’ve created on your website.
- Manage Form Fills: This section allows you to customize what Campaigns, Tags or Sequences are added by the form itself. Every form submission, even failed Order Form transactions will add these Campaigns, Tags and Sequences. See the section on Conditional Rules to add Tags or Sequences only on a successful payment. It is strongly recommended to use Campaigns for all of your automation, and to leave these sections blank.
If your Campaign, Tag or Sequence is already created, click the + Add button and select it. You can also create new Campaigns, Tags and Sequences from this interface.
Always On Rules: You can create rules that are triggered when a contact fills out your smart form, enabling you to run sophisticated actions on contacts as they come in through your forms. Click the +Add Rule button, name the rule, add conditions and what should happen. Learn all about rules here.
Conditional Rules: The Smart Form Always On Rules section becomes the Conditional Rules section if you add a product to sell to the form. This allows you to fine tune the response based on the result of the charge attempt. See Creating an Order Form for more information.
- Notification: If you’d like to be notified by email every time a contact fills out your smart form, insert your email address in the text box.
- Routing: Select who on your team should be the contact owner of any new contacts filling out this form. You may also choose to add new contacts to a lead router.
Publish your form on a website or landing page
Now that your form is created, styled, and set you’re ready to test and publish! The Publish button gives you multiple options when it comes to placing your form online.
If you are using an integrated WordPress site with the PilotPress plugin installed, you can select your Smart Form from the Add ONTRAPORT Media button. Seee WordPress Integration Overview for more information.
You may also copy and paste form code into your WordPress page. The Publish button gives you multiple options when it comes to placing your form online. Javascript Snippet is the easiest version to manage later, as all updates you make to the form in ONTRAPORT are automatically propagated to all versions of the form on line. It is the most popular method of adding the form code to a non-integrated WordPress page, or to any other website. The HTML Version shown may not be available to you. See our List Bombing article for more details.
Field Settings in Detail
Field Settings allow you to change the settings for a single field. Click a new field within your canvas area to reveal the field settings.
- Required - Require an entry in this field.
- Field Label - What your contact sees for the field label, such as "Enter your First Name"
- Prefill - Default text for the field; your contact can change it or leave it to be entered into their Contact Record.
- Placeholder - Similar to prefill but it disappears when users click on the field or submit the form.
- Background Tab
This area contains the following settings:- Background color
- Background image
- Background position
- Background repeat
- Border - This area contains the following settings to add and adjust a form border, style it, and size it:
- Border style
- Border color
- Border size
- Border radius
- Padding - See spacing and padding key.
- Page Background (for hosted items) - This area contains the same settings as the above background settings for forms that will be hosted on their own page with ONTRAPORT.
Action Buttons
- Add Field - Insert Contact Record fields into your form (or create new ones!)
- Add Content - Add content (images, text, tables, code) to your form.
- Add Separator - Add a separation line between sections of your form.
- Get Paid - Add an ONTRAPORT Partner link image to your form.
- Sell Products - Turn your Smart Form into a customizable order form. Add your product(s) and tweak the shipping, payment method, payment options, tax, invoice, and design settings.
- Conditions - Add conditions to your forms (see Form Conditions for more information).
- reCAPTCHA - Add reCAPTCHA to your form. See directions below.
About reCAPTCHA
reCAPTCHA uses a single mouse click to confirm the visitor to the page is not an automated "bot" and helps prevent spam submissions.
Note: The original Captcha on Smart Forms has been discontinued. ONTRAPORT has disabled the older Captcha in order to allow your forms to continue processing opt ins and orders. To replace the old Captcha with this new version please edit your forms and follow the instructions below to add a new reCAPTCHA to the forms.
Signing Up and Configuring reCAPTCHA
Go to Google reCAPTCHA and click the Get reCAPTCHA button at the upper right. Name the integration in the Label field. You will use a single reCAPTCHA configuration for all the forms you add it to in ONTRAPORT. Select reCAPTCHA V2 in the Register a new site dialog box. The dialog box will expand to allow you to enter all of the domains you will use reCAPTCHA on. In addition to your own domains add these ONTRAPORT domains if you plan to use them for ONTRApages:
ontraport.net
ontraport.com
qwkcheckout.com
safechkout.net
securechkout.com
securechkout.net
myquickcheckout.com
safechckout.com
safecheckout.info
checkoutnow.info
viprespond.com
vip2site.com
vipreplynow.com
zreply.com
You can return to add additional domains later.
Check the box next to Accept the reCAPTCHA Terms of Service and Send alerts to owners, and click Register.
Copy the Site Key and Secret Key to a text file for use later in ONTRAPORT.
Adding Your reCAPTCHA Keys to ONTRAPORT
In ONTRAPORT, click the profile icon at the top right and select Administration. Click on the Security tab and the reCAPTCHA Settings.
Enter the Site Key and Secret Key numbers from reCAPTCHA in the appropriate spots, and click Save.
Opt-in Settings (link)
Adding Campaigns, Tags and Sequences to Form (not recommended)
The Manage Form Fills and Always On Rules sections are where you customize what tags, sequences, and rules get applied to a contact when they come through your form. We recommend you use a Campaign with a Trigger for "Fills Out Form" instead of these sections.
Form Conditions (link)
Advanced Form Settings
These settings are rarely used, but are provided for advanced form handling.
Override Email Address Merge with Cookie Data
Whenever someone fills out one of your forms, opens up one of your emails, or visits one of your PURL pages, we automatically place a special tracking cookie onto their browser that identifies them so when they visit your site in the future (provided your site has our tracking scripts on it). This is precisely how we're able to provide all the great site-visit tracking information for you in the contact log area of your contacts' records.
In most cases, when someone fills out one of your forms, our software looks at their email address to decide whether they're a new contact or if they already exist in your database. If the email address matches one of your existing contact records, then the new info is simply merged in with the existing record for this contact. If not, they're treated as a new contact and a brand new contact record gets created for them.
However, when you check the 'Override Email Address Merge with Cookie Data' checkbox, it makes it so that if we already know who the contact is based on their cookie data, then regardless of what they put as their email address - or even if they don't input one at all - we still update the contact record for that contact.
This feature is typically used when:
- You want to use a SmartForm in order to allow your current contacts to update their existing contact info on a form where you don't want to have (or require) email address.
- You want to use two or more forms strung together, one after the other to gather progressively more information, where only the first form in the series requires email address. In this case, you wouldn't check the 'override email merge' box on the first form but would on all subsequent forms. That way, the new record will be created (and the cookie will be set) on the first form, and all additional data gathered from subsequent forms will be added to that contact's record.
Pass CGI variables to landing/thank-you page
This is an advanced feature that takes the data input into form fields and puts it in the URL of the Thank You page so that it can be used by other scripts. If you don’t understand this, ignore it. It’s for geeks.
Redirect after immediate campaign and sequence steps run
This option delays displaying the Thank You page until all immediate steps in a Campaign or Sequence added via the Manage Form Fills dialog is completed. This can make the form appear to process more slowly, and is not recommended.
Geolocation
Smart Forms use IP geolocation to determine city, state and zip code for new contacts who haven’t filled out location details. Note: this will only take affect if these fields were not manually entered by the contact on the Smart Form. If you would like this feature turned off, just contact our support team.
Posting your Form
The Publish form button gives you multiple options when it comes to placing your form online:
Three options are available via the links on the left, I will install my Form, Send to my webmaster and Host my Form.
I will install my form
Select from the following types of code we supply to place a form on your website.
Javascript Snippet:
This is the easiest method. Only a small snippet of code is required to copy and paste onto your website, and all the form code is retrieved from the OTNRAPORT servers when the page is displayed. This allows you to copy and paste the form code once. Any changes to the form made within ONTRAPORT will automatically be reflected wherever the form code is posted
Light Box:
Provides a code snippet that generates a link. When the link is clicked, the form pops up in the center of the window. You can edit the text for the link, or substitute an HTML image tag to use an image as the link. Changes made in ONTRAPORT will automatically be reflected on your website without having to copy and paste the form again.
iFrame
IFrame code is the most robust, and should be used if your website experiences jQuery conflicts with ONTRAPORT forms. Changes made in ONTRAPORT will automatically be reflected on your website without having to copy and paste the form again.
HTML Version
If you want to change the HTML/CSS of the form use this version. Please be cautious when changing this code, and be mindful that we cannot support custom coded forms. If you change the form, you must copy and paste the form code on your website again.
The HTML Version option will not appear if you have opted in to the enhanced security protections against list-bombing and spambot submissions. The following section has the details on enabling this protection:
Form Security Option: Disable Custom HTML Forms
In response to spammers, list bombers, and bot submissions, ONTRAPORT employs a number of secret protection measures to stop the bad guys in their tracks. When a potential opt in is identified as bad the data is not added to the Contacts database at all, and no indication is given to the spammer that they have failed in their attempt. This prevents them from submitting the form millions of times trying to find the right combination of values. This enhanced security is enabled on all new accounts and available to all existing accounts.
Why don't we force it to be enabled on all accounts? Enabling this option may break:
- Any form installed on LeadPages, ClickFunnels or any SaaS platform that strips out or interferes with our JavaScript
- Any form installed on a website if that site also includes a plugin, theme, or server configuration that prevents our JavaScript from communicating with the ONTRAPORT servers (common with some security plugins and specialty web hosts).
- Any form presented to a prospect who is using a text-based browser such as Lynx or is using a JavaScript blocker such as NoScript.
Because the form submission does not return an error page to the spammer, list bomber or bot, a valid prospect will not know that their opt in has failed. You will have no record in your account that the attempt was made. If you decide to turn this option on, please re-test your existing forms to make sure a valid Contact Record is made.
Turning this feature On will have two immediate results:
- Legacy Smart Forms will no longer have the HTML Version form code available on the Publish screen.
- The enhanced form security processes will be enabled for all future submissions to your account from all existing and future Smart Forms, ONTRAforms and Smart Form blocks in ONTRApages.
Unless the existing embedded forms are installed on a service that blocks our JavaScript, they will continue to work even if they were installed using the HTML Version form code. Retest your forms after turning this feature On.
Turning this feature Off will make the HTML Version code available in Legacy Smart Forms and the enhanced form security processes will not be active. Spammers, list bombers and bots will still be able to get past our regular protection measures and submit bad contact information you will have to prune manually.
How to Enable Form Security:
- Click the profile icon in the top right of your account and select Administration
- Click the Security tab
- Slide the toggle under Disable Custom HTML Forms to On
Send to my Webmaster
This option allows you to email the HTML and Javascript form code to your webmaster
Have ONTRAPORT host my form
This option makes ONTRAPORT host the form on its own page. The link to the hosted page is given to you upon selecting this option. For order forms, remember to change the "http:" to "https:" to serve the page from our secure servers.
FAQs
Q. I want all my contacts to verify their email address on my forms. Can I do that?
A. Yes, add the Confirm Email field to your form.
Q. I had the old Captcha on my forms, and it's gone now. What's up with that?
A. Google disabled the old Captcha in January 2018. To keep your forms working, we disabled the function on all custom domains. This article has information on adding the new reCAPTCHA to your legacy Smart Forms listed above. For more specific information, please see this Community Q&A Article.
Comments