How to Embed a Form to the Unbounce Smart Builder

August 18, 2022

Unbounce is a landing page builder with smart features that let you create beautiful, high-performing marketing campaigns for your business. With Unbounce’s AI-powered technology, you can create custom landing pages in just a few minutes.

Previously, you could only embed your Jotform form to the Unbounce Classic Builder, but now that Unbounce has introduced the Jotform App, you can embed a form to its Smart Builder. Your form will be on your Unbounce landing page in just a few steps. Let’s start!

Installing the Jotform App

The first thing you should do is install the Jotform App within the Unbounce Smart Builder. Follow these steps:

  1. In the Smart Builder, click the Apps icon (the puzzle piece) on the top left side of the page.
  2. Search for Jotform.
  3. Click the Plus icon within the block to install the Jotform App.
unbounce-install-jotform

Once the app is installed, you’ll get a confirmation message, and the Smart Builder will display Jotform among the list of layouts you can use.

Embedding a Form in a New Section

After installing the Jotform App, you can add a new section and embed your Jotform form there. Here are the steps to do that:

  1. In the Smart Builder, add a new section by clicking the Plus icon within the existing section. You can add Jotform at the top or bottom of an existing layout.
unbounce-add-new-layout
  1. Select Jotform from the list of sections.
  2. Choose from the list of premade Jotform layouts, and click the one you want to use. (You can always change this later.)
How to Embed a Form to the Unbounce Smart Builder Image-1
  1. In the newly added Jotform section, click the Add a Jotform button. You have to authorize Unbounce at this step by logging in and clicking the Allow button on the popup.
unbounce-jotform-layout
  1. The next window will display your list of forms. Click on the form you wish to embed.
unbounce-jotform-list-of-forms
  1. The page will now display your form with its minimum height and width.
unbounce-jotform-section-with-jotform-form

To adjust the height and width, please visit the next guide from Unbounce: Editing or Updating a Form.

Embedding a Form by Replacing an Existing Element

If you don’t want to add a new section, you can replace an existing element on the page with Jotform. Just follow these steps:

  1. Locate the element you want to replace and click its Change Element icon.
  2. Open the list of Forms.
  3. Click on Jotform.
unbounce-change-element
  1. This step is similar to steps 4–6 above when adding a new section: Click the Add a Jotform button, authorize Unbounce, select the form from the list, and adjust its height and width.

See Changing Elements on Your Smart Builder Page from Unbounce to learn more.

Academy Logo

Introduction to Form Building

Embed Your Form, and Create Editable PDFs

Go to course :Embed Your Form, and Create Editable PDFs
lesson-2 - image
Contact Support:

Our customer support team is available 24/7 and our average response time is between one to two hours.
Our team can be contacted via:

Support Forum: https://www.jotform.com/answers/

Contact Jotform Support: https://www.jotform.com/contact/

Send Comment:

Jotform Avatar
This site is protected by reCAPTCHA and the Google Privacy Policy and Terms of Service apply.

Comments:

  • GFA Representações - Profile picture