Company Blog Support
Frank Hagan
Updated

Contents

    Back to Top

    ONTRApages Premium Form Connector

     

     

     

     

    About the Form Connector

    ONTRApages Premiumexternal link includes the Form Connector, a method to simultaneously submit opted-in contacts to both ONTRApages and your email program / auto responder, if supported. Now you can have beautiful, responsive opt-in forms on your own ONTRApages designs and use them with other programs.

    The following programs do not allow the Form Connector to connect:

    • AWeber
    • ConvertKit
    • iContact
    • GetResponse
    • Mad Mimi

    Note: Due to increasing security concerns many programs block the Form Connector. We recommend you use the Zapier Integration for these programs.

    When using the Form Connector, ONTRApages Premium fills out and submits the form you specify in the background. This process is transparent to the user. Remember:

    • Your contacts will never see the form in your email program / autoresponder so be sure to include any notices your email program / autoresponder requires on your ONTRApage.
    • Your new contact will be redirected to the Thank You page specified in ONTRApages Premium, and not to the Thank You page on your email program / autoresponder form.
    • Other actions taken by the form filled out in the background by ONTRApages should work as before. Test to verify that your newly connected form adds new contacts to the correct list, sends the appropriate emails, etc.
    Prerequisites
    • An ONTRApages Premium Account
    • A third party form you want to submit when you submit your ONTRApages Premium form.
    Using the Form Connector
    1. Create and save your ONTRApages page with a Smart Form block first. Add fields to the ONTRApages form so it will match the form you wish to connect to in the background. Make the fields on your ONTRApages form the same type, and also "required" if the matching field on your other form is "required". You must have at least the required fields on your other form represented on your ONTRApages form.
    2. Click the Smart Form block to edit it, and then click the Form Settings gear icon.

      form-connector-600.png

    3. The Form Settings dialog will pop up. The middle section will be titled Form Connectors .
    4. Click the Add New button. In the Form Connector pop up, enter the URL where your other form is hosted on the web. Then, click the Get Form button.
    5. ONTRApages will go to that URL, and search for the form. If found, ONTRApages will list the fields in ONTRApages ("This Form") and the matching fields in the other form ("That Form"). Select the down arrow next to the field listed under "This Form" to match it to the other form. Select Ignore Field from the drop down to not modify the field on the other form.

      form-connector-1.png
    6. When finished matching fields, click the Test Connection button. ONTRApages will determine if it can fill in the form and submit it in the background. If the test is successful, click the Save button. If the test is not successful, double check to make sure you have required fields on your ONTRApages form that match up to the required fields on your other form, and retest.
    7. Publish and then test the ONTRApages form. Check to see that the other form submits the data to your mail list / autoresponder.
    8. When your contacts fill out the ONTRApages form, the following will happen:
      1. The contact is added to your ONTRApages account.
      2. ONTRApages submits the other form in the background. The other form may add the contact to your mailing list database or take other actions. All of the functions normally present if the contact had filled out that form should work in the same manner, except for the redirect to the "Thank You" page. The ONTRApages thank you page redirect will take precedence.
      3. If your mailing list or autoresponder is configured for double opt-in the contact will receive an email with a link to double opt-in.
      4. Be sure to include all the required notices for your other form on the ONTRApages page to avoid violating the terms of service for that company. Include any legal disclaimers for that opt-in form on your ONTRApages page.
    Notes for Specific Email / Autoresponder Programs

    The following programs no longer allow the Form Connector to connect:

    • AWeber
    • ConvertKit
    • iContact
    • GetResponse

    For these programs, manually exporting the contacts from ONTRApages and uploading them is one method you can use. For ONTRApages Premium accounts, the Zapier integration is an automated way to add Contacts to those programs as they are collected by your ONTRApage or ONTRAform.

    Campaign Monitor

    1. Campaign Monitor masks the appearance of their self-hosted forms. Use the option named Copy/paste a form to your site instead of the direct link to a subscription form.

      cm-copy-paste.png
    2. Host the code on a webpage, and use that URL in the Form Connector.
    3. If you don't have a web page to host the form on, continue with the instructions below:
      1. Create a NEW ONTRApage, starting from scratch with NO forms on it. Add any non-form block to the page to enable saving the page. Remember, this page will only be used to provide the Campaign Monitor form to your ONTRApages, so don't worry about design options, etc. After adding a non-form block, save the page.
      2. Click the Settings tab.
      3. Paste the Campaign Monitor form code into the Custom header code section.

        cm-paste-code-header.png
      4. Publish that page on one of the ONTRApages domains using any URL you desire, such as "http://cmform.ontrapages.com"

        cm-publish.png
      5. Use the URL you just created in your ONTRApages Form Connector!

    Constant Contact

    1. Create your forms or use the provided forms in Constant Contactexternal link.
    2. Click on the Actions menu on the web sign up form, then select Form URL.

      cc_actions_form_url_section.png
    3. Copy the URL for use in the ONTRApages Form Connector

    MailChimp

    MailChimp uses a pop-up Captcha on the default opt in form as per this article. This is to prevent automated "bot" submissions, but also results in submissions from the ONTRApages Form Connector being blocked.

    However, you can embed a custom opt in form in a page on your website or even on another ONTRApage and connect to it. MailChimp also has three hidden fields that are pre-populated with data to thwart bots; choose Ignore Field when matching these on the Form Connector.

    Here are the steps to create an embed type form that the Form Connector can connect to:

    1. In MailChimp, select your Mailing List to use for your opt ins.
    2. When the page for the mailing list opens, select "Signup forms" and then "Embedded forms". 

      On the mailing list screen select Signup forms and embedded forms to use for the Form Connector

    3. On the next page, you want to have the form show only the fields you will match up to your opt in form on your ONTRApage. At a minimum, you will want the Email Address and make it "Required". You may also want first name, last name, address, etc. You specify these fields in the Form Builder link on that page (under the "Show only required fields" radio button.
    4. When you have the fields specified correctly, copy the form code for use later in ONTRApages.

      Copy the embedded form code to post on your website or another ONTRApage

    5. You can paste that code on your own website, or even on another ONTRApage using the Custom HTML block. The following steps show how to use another ONTRApage and keep this "secret ONTRApage" from being indexed by search engines.

      1. To host the MailChimp embed form on an ONTRApage, create a new ONTRApage using the "Start from Scratch" template.
      2. Add a Custom HTML block to the template.
      3. Click to edit the Custom HTML block. Click the "Edit Code" button. Delete all of the sample code in the Custom HTML block.
      4. Paste the MailChimp Embedded form code into the Custom HTML block. Save the block on the left, then click the Save button at the top right of the ONTRApage.
      5. Click "Publish" and host the ONTRApage on any domain. Remember this page won't be seen by anyone else; it is only being used by the Form Connector to automatically add any of your ONTRApage opt ins to MailChimp. Copy the published URL for use later in the Form Connector on your opt in ONTRApage.
      6. Click the Settings button for the ONTRApage. To prevent search engines from indexing the page or the links on the page, put this line in the Custom Header Code section:

        <META NAME="robots" CONTENT="noindex,nofollow">

        Insert the command to prevent search engine indexing into the custom header code section of the settings
      7. Save and exit the ONTRApage.

    6. After hosting the MailChimp Embedded form code on your website or on another "secret" ONTRApage, go back and open your opt in ONTRApage for editing.
    7. Click on the Smart Form in the palette on the left to open it for editing.
    8. Click the Form Settings icon at the bottom.

      the form settings icon is inside the smart form editing section

    9. Click to Add a new Form Connector.
    10. Add the URL where you hosted the MailChimp embedded form code.
    11. The Form Connector will connect to the form and retrieve the fields on the form. Match up the fields. If you see a field you don't recognize on "That Form" (the MailChimp embed form you are connecting to) set the match "Ignore Field"

      match the fields you recognize to the ONTRApages fields and use ignore field for any you don't recognize

    12. After clicking the Test Connection button, save the ONTRApage and test it using a test contact on the published page. You should see the contact added both to the ONTRApages Contacts section and also in your MailChimp email List section.
    13. Contact us in the Facebook Support Forum for help if you need it!

    Remember that you can also export your contacts and import them into MailChimp, or consider using the Zapier Integration.

    SendPepper

    1. Create your Smart Form in Sendpepper.
    2. Click the Publish Form button, then click on Host my Form.

      sendpepper.png
    3. Copy the provided URL for use in the ONTRApages Form Connector

    Other Forms (Gravity Forms, Formidable, etc.)

    Host the form as you normally would on a web page. Provide the URL for that web page in the ONTRApages Form Connector. The actions specified by that form will still take place, except for any redirect after submission actions. The ONTRApages form takes precedence for redirecting the contact after they submit the form.

     

     

     

     

    Articles in this section

    Created - Updated
    Have more questions? Submit a request

    Comments

    Powered by Zendesk