How Do I Add a Wufoo Form to My Landing Page?

Follow

Note:

Unbounce is not currently able to track the behavior of third-party/embedded forms. Any Wufoo form submission will not count as a conversion in Unbounce - you will need to access the lead data directly within the Wufoo platform. 

There are some use cases you may choose not to use Unbounce's native forms. You might have a pre-existing form outside of Unbounce that you've configured to work with your setup, specific design requirements, or data compliance.

The article will walk through how to set up a Wufoo form on your Unbounce pages. There are two steps, the first is retrieving the embed code for your Wufoo form, and the next and final step is to embed this form to your Unbounce landing page

What you'll need

  • A Wufoo account with a form, and 
  • An Unbounce page you want to embed a Wufoo form with.

Retrieving the Embed Code of Your Wufoo Form

  1. Sign in to your Wufoo account and navigate to the Forms section.
  2. Click on whichever form you would like to embed on your Unbounce page:
    Annotated image of Wufoo platform highlighting Forms tab
  3. Review the appearance of your form, and select Share Form in the bottom right-hand corner:
    Annotated image of the Wufoo platform highlight the Share Form button
  4. A new page will appear. Select the iFrame option from the embed settings below:
    Text box containing Wufood embed code
  5. Click the Copy button to copy this embed code to your clipboard, and navigate back to Unbounce. 

Setting up the Embed Code in the Unbounce Classic Builder

  1. Log in to Unbounce.
  2. Head over to the Page Overview of the landing page that you wish to embed with your Wufoo form.
  3. Click the Edit button beside the variant you want your Wufoo form to appear on to launch the Classic Builder.
  4. In the Classic Builder, Select the Custom HTML widget from the left toolbar:Annotated image of Classic Builder with arrows pointing to HTML widget on Contents panel
  5. Paste your Wufoo embed code into the Custom HTML widget:
    A text box containing code from Wufoo
  6. Save and Preview your landing page:
    An annotated image of a form with three fields on a landing page

And that's it! If you run into any trouble with the layout or appearance of your Wufoo form, we recommend connecting with Wufoo's support team for assistance.