Company Blog Support
Martin Cogburn
Updated

Contents

    Back to Top

    Legacy Smart Forms FAQ

    Note: This article covers the legacy Smart Forms. For modern mobile responsive opt-in and order forms see our ONTRAforms and ONTRApages articles.

    Applies to: ONTRAPORT Pro and higher accounts

    Q: What are Smart Form conditions for?

    This article should clear everything up for you.

    Q: My Smart Form doesn’t look right [in Firefox, Chrome, Safari, IE, preview]. Why?

    If your form doesn’t match the design, let us know. There may be cases where certain browsers render text or spacing in slightly different ways which we can’t control, but for the most part, it should match.

    Q: These fonts stink. How can I get cooler ones?

    Google Fonts! Here’s an awesome video on how to use these in your forms.

    Q: Where can I find images to use on my Smart Forms?

    You can buy stock images online. We like istockphoto.com because they have a ton and it’s cheap. Here are some links to free or open source images:

    Q: Can I make a three column Smart Form?

    Not in our legacy Smart Form editor, but you certainly can in ONTRAforms.

    Q: I want to add a field to this form that I haven’t created previously; how can I?

    Now, in addition to being able to create sequences on the fly you are able to now create custom fields.

    Here's how:

    On the design tab, click the Add Field button and select Create new field option in the drop down.

    Create New Field

    Q: How do I round the edges of fields and borders?

    In the Design tab, click the Form Style tab and edit the Border Radius

    Q: How can I add a background image to the Smart Form?

    In the Design tab, click the Background tab edit the Background Image

    Q: Get Paid? What does that mean?

    It means we’ll add our company logo to your form. Why? If a person clicks it, a cookie with your affiliate info will be added to their computer and if that person signs up for an ONTRAPORT account, we'll pay you 25% recurring affiliate commission for ‘em.

    Q: How can I access the place where I apply Tags and Sequences, change my opt-in settings, and that kind of stuff?

    You can find all that in the Settings tab of the Smart Form editor.

    Q: Do these forms work on WordPress? How wide should they be?

    Yes, they (will) work. If they don’t, let us know. For a typical 2 column WordPress site, stick to less than 425px wide for the main, wide column or 175px for the skinny side column. (Your mileage may vary. Test.)

    Q: What's the difference between placeholder and prefill?

    Prefill allows you to add text into the field itself for clarification or further explanation. Prefill will submit with the form if you don't change it, like a default entry. Don’t use this for required fields because your prefill value will count as the required entry, thus foiling your efforts to glean that bit of info. Placeholder is similar to prefill but it disappears when users click on the field or submit the Smart Form.

    Q: Which opt-in setting should I choose?

    Single opt-in allows you to start mailing contacts immediately, while double opt-in requires that people verify their email address by clicking a link in email that’s sent to them. We recommend learning the pros and cons of each before choosing. Learn more.

    Q: How do I prevent blank/junk Smart Form fillouts?

    Decrease the amount of bot sign-ups by using a reCaptcha image. You can enable these by clicking the reCaptcha button on your Smart Form builder screen. reCaptchas greatly decrease the amount of ‘junk’ fill-outs (if not completely eliminate them).

    Q: How do I place a Smart Form on a Facebook Business page?

    To do this, you’ll need to install an app capable of supporting an iframe onto your Facebook Business page. We recommend iframe apps which you can get here.

    Q: Which "Publish" code should I use?

    When you click the Publish button, you have a choice of four different code snippets to use.

    Javascript provides the shortest code snippet. When the Javascript code is inserted on your web page, all of the form's elements are retrieved from the ONTRAPORT servers each time someone visits the page. This allows you to make changes to your form that are automatically reflected on your websites. Otherwise, you would have to copy the changed code and paste it into each page where the form appears.

    Light Box code provides a link that pops up a window when clicked. It uses Javascript, and like the Javascript code, all the form's elements are retrieved from the ONTRAPORT servers each time someone clicks the link.

    Iframe code displays a "picture in a picture" view of your form, displaying it as it appears on the ONTRAPORT server. We consider an iframe the "last resort" if a theme or script on your site is overriding the look and feel of the form. The disadvantage of using an iframe is that some browsers may display a security warning that your webpage contains content from another website.

    HTML code allows the most customization, and most of the elements in the form reside on your webpage and not the ONTRAPORT servers. This may make the form display faster. However, changes to the form may not be automatically reflected on your web pages, forcing you to copy and paste the form code for each change you make in ONTRAPORT. For the technically savvy, the following form elements can be changed in ONTRAPORT without having to copy and paste the form code into your web pages again:

    • Anything under the form's Settings tab
    • Style settings such as fonts, form width/height, color, etc.
    • Conditions

    Any other changes to the form, including adding fields, content, editing field labels, adding Captcha, etc. will require you to copy and re-paste the code into your web pages.

    Q: How Do I Host my Smart Form on a Secure Page?

    In addition to hosting your Smart Form on a Secure Landing Page on a domain we provide, you can also use the Smart Form's HTML code and embed it on your website's secure page.

    Q: I want my contacts to verify their email address on the opt-in form. How can I do that?

    Add the field Confirm Email to the form. Look for it near the end of the form field list, as shown here in an ONTRAform:

    Articles in this section

    Created - Updated
    Have more questions? Submit a request

    Comments

    • Avatar
      Melissa McConaghy

      How can I use the smart form as a 'contact us' form please? I would like to add a message field and have the messages emailed to me directly. Is this possible? Thanks. Mel 

    • Avatar
      Melissa McConaghy

      Is it possible to use a smart form for mobile apps? If so, are any changes required to the code? Thanks. Mel 

    • Avatar
      Susan Dean

      I have created a smart form but want to know if my customers can re-visit their forms to change their answers if they need to. Is this possible?

    • Avatar
      Frank Hagan

      Hi Susan - If your customers enter the same email address when returning to the form they can update their information in the database with their new entry. But if they use a different email address it will create a new contact record.

      If you want to remove the chance that they will use a different email address you can send them to a PURL Landing Page with the form on it. You would send them the link to the "Personalized URL" landing page in an email. Whenever they visit that link we know who they are, and any information they enter on a form will update their contact record.  See this article for more on PURLs:  https://ontraport.zendesk.com/entries/23238557-PURLs-Overview

    • Avatar
      Dr. Kelly Schuh

      How can I get the form to center on a Wordpress page? I have tried putting it in a div with css style to text-align:center but that doesn't work. I don't see anywhere to edit the iframe code to be "middle" aligned. I set everything in the form to center top that I could find.

    • Avatar
      Frank Hagan

      Hi Dr. Schuh - WordPress can be challenging because the local theme can override the form's styling. You can try the following:

      • A centering DIV using an inline style declaration for "margin: 0 auto;", such as:
        <div style="margin: 0 auto;">Form Code Here</div>
      • Using standard HTML CENTER tags:
        <center>form code here</center>

       Many themes will overwrite the CSS so the second example usually works where all else fails.

    • Avatar
      Tama Kieves

      How do we EDIT an existing SmartForm?  When I go to our SmartForm list now, none of the tabs/editing options that we used to see in Office AutoPilot are appearing??!

    Powered by Zendesk