Skip to main content

🖼️ iFrame

The iFrame element in FormNX lets you embed any external webpage or content into your form using a URL. It's perfect for displaying live pages, dashboards, documentation, or any external resource directly within your form — without sending users away.

📌 How to Add the iFrame to Your Form

Follow these simple steps:

  1. Open the Form Builder.
  2. On the left hand side, you'll see the Elements section.
  3. Find the iFrame element.
  4. Drag and drop the element onto your form OR click on the element to add it automatically.

Once added, the iFrame will appear in your form layout, ready to be customized.

How to add iFrame field and setting configuration for the iFrame field

⚙️ How to Configure the iFrame

To customize the iFrame:

  1. Click on the iFrame element in your form.
  2. The configuration panel will open on the right hand side.

From here, you can configure the following options:

  1. Question Label ✏️
  • Add a label for the iFrame element that will appear above the embedded content.
  • Example: "Take a quick look at our pricing page below."
  1. Hide Question Label 🙈
  • Enable the Hide Question Label option to hide the label while keeping the iFrame content visible.
  1. Field Width 📐
  • Adjust the width of the element to control how it appears on the form.
  • Useful for placing the iFrame alongside other fields or full-width on the form.
  1. Frame URL 🔗
  • Enter the URL of the webpage or content you want to embed inside the iFrame.
  • Example: https://example.com/
  • 💡 It is recommended to use an HTTPS URL — many websites and browsers block content loaded over insecure (HTTP) connections inside an iFrame.
  1. Width 📏
  • Set the width of the embedded iFrame content.
  • Adjust based on how much horizontal space you want the embedded page to fill.
  1. Height 📐
  • Set the height of the embedded iFrame content.
  • Choose a height that comfortably displays the embedded page without too much scrolling.
  1. Field Name 🏷️
  • Set a custom field name used internally (helpful for identifying the element inside the form builder).

👤 How It Works for Users

When users open the form:

  • They'll see the embedded webpage or content displayed inline with the rest of the form.
  • They can interact directly with the embedded content (e.g., scroll, click links inside the iFrame — depending on what the embedded site allows).
  • The iFrame element is display-only for the form itself — it doesn't collect any data from the user.

💡 Common Use Cases

  • Embedding a pricing page, FAQ, or knowledge base inside a contact form.
  • Showing a dashboard or live report within a feedback form.
  • Displaying product pages or landing pages in lead generation forms.
  • Embedding external tools or calculators users can interact with before submitting.
  • Adding documentation or help pages alongside an application form.

The iFrame element gives you the flexibility to bring any external webpage or content directly into your form — making your form more powerful, informative, and self-contained.