1.iframe
      Back to home
      1. Help
      2. Embed forms
      3. 1.iframe

      How to embed using iframes

      How to embed a form on an external website.

      What is iframe embedding?

      You can embed the form you created in the form editing page on an external page using iframe.

      How to embed a form on an external site using iframe embedding

      1) Create the form in the form editing page.

      2) Click "Form Embedding (iframe)" under the form settings for the respective form.

      【① Specify the Form Embed URL】

      - Form Embed URL

      Enter the URL of the site where you want to embed the form.

      * Include all domains or URLs where the form may operate, such as development or staging environments.

      【② Choose Embedding Method】

      Select and copy the method that suits the page where you want to embed the form.

      - Script Installation

      - Form URL Entry

      For detailed instructions on how to embed a form into a webpage created with the following CMS tools using iframe embedding, please refer to the following article:

      Share Your Form with iframe Embedding on Your Website (STUDIO, Wix, Pelaiti, Ameba Owned, Jimdo, WordPress)

      Important Notes

      (1) Forms embedded in webpages created with Ameba Owned may not display correctly in Safari environments.

      As a solution for cases where the form does not display, we recommend including the form URL separately so that respondents can contact you.

      (2) If you are using step layout, iframe embedding is not available.

      (3) If required fields are left empty, the length of the form may change.

      We recommend testing the form by performing test inputs and submissions to ensure that it is correctly embedded and functioning.

      For example, when required fields are left empty, some parts of the submit button may become invisible.

       
       

      To submit the form successfully, you need to register all URLs used to connect to the site with formrun. Please check if the "Form Embed URL" is correctly set in the settings menu "Form Embedding (iframe) > Form Embed URL".

      Check for:

      - Spelling errors in the URL

      - Inclusion of "https" or "www" in the URL

      FAQ: When I click the submit button on a form embedded with iframe, it stays on "Submitting," and the submission is not sent.

      When setting the script tag on the destination page for embedding, redirection may fail because it is expanded inside the iframe. Therefore, remove the [data-formrun-redirect="true"] specified in the setting tag in "Form Embedding (iframe) > 1. Script Installation." However, please note that this setting tag is an option that controls redirection with the parent frame (outside of the iframe). If you remove [data-formrun-redirect="true"], the thank-you page will be displayed within the iframe.

      FAQ: I want to specify multiple URLs for the "Form Embed URL." Is there a limit to the number of URLs I can specify?

      For both Code Type Forms and Creator Forms, there is no limit to the number of "Form Embed URLs" that can be specified in all plans, including the FREE plan.

      FAQ: If I edit a form that has already been embedded using iframe embedding, will the embedded form on the external site be automatically updated?

      If you edit a form that has already been embedded using iframe embedding in the formrun form editing page and update it, the changes will be automatically reflected in the embedded form on the external site.

      FAQ: I have used iframe embedding, but the preview page is not displaying.

      If you have performed iframe embedding, you need to register the URL of the preview page of the page where iframe embedding was performed in the "Form Embedding (iframe) > Form Embed URL" section of the development settings. If you do not register it, the iframe embedding will not be reflected on the preview page. Also, please check the following:

      - Spelling errors in the URL

      - Inclusion of "https" or "www" in the URL

      FAQ: Even when I embed the form on an Ameba Owned page, the form is not displaying.

      If the form is not displaying on a webpage created with Ameba Owned, there may be the following possibilities:

      A) Viewing in a Safari environment

      The form may not display correctly in a Safari environment. This is a specification of Safari, and it cannot be fixed on the formrun side. Therefore, as a current solution, we recommend including the Form URL on the embedded page so that respondents can contact you.

      B) Displaying using the "Embedding Form Script" method

      If you embed the form using a script in Ameba Owned, there may be cases where the form does not display. This issue is not with formrun but may be due to Ameba Owned's specifications. If the form does not display when using the "Embedding Form Script" method, setting it using the "Embed Form URL" method may result in more stable display.