JotForm User Guide / Share Forms /

Getting the Form iFrame Code

Getting the Form iFrame Code

iFrames are commonly used on embedding 3rd party services to your web page. Social sharing buttons, various widgets, and most of the stuff out there is added with an iFrame code.

Don't know the difference between embed codes? Check it out here.

Copy the iFrame Embed Codes correctly and pretty much nothing can break the form on your page. Since your form is called inside an iFrame it does not conflict with anything on your page.

To get the iframe code, please follow these steps:

1. Click PUBLISH at the top of your Form Builder.

2. Go to the EMBED section.

3. Select the IFRAME embed option.

4. Lastly, click the COPY CODE button to copy the codes.

Tell us how'd you do? Please share your thoughts and suggestions in the comments section below.

Send Comment

91 Comments...

See all comments
  • 5Kforms

    That did the trick, thank you!

  • sstte18

    oh ok. thanks. I had clicked on the publish tab and iframe didn't come up as an option.

  • HanginLoose

    I was not able to do it. Can you do it for us? www.hanginloose.com

  • techisles

    does this method work in wordpress?

  • Dave4777

    I'm not a real fan of iframes, but I'm testing. There is a feature which is locked that says something like auto switch to full page, but I can't unlock it !!??

  • BilegItiNarvacan

    when I copy code, what's next? Where will I paste the copied code?

  • julianenglish

    I copied the Iframe code and pasted it on my website. What I ended up with were paragraphs of code - No readible form - I am using Word Press
    What shoud I do?

  • Sara Foss

    Trying to embed JotForm contact form. Using IFRAME doesn't work - preview shows a long, skinny rectangular box. Using Souce Code - preview cuts off the bottom (as others have mentioned) and freezes up the screen. Please advise on if this will be fixed or how else I can put a contact form on a custom page!

  • hkmurano

    I did ... still same oroblemproblem.
    cut the bottom of form
    Please let me know step by step

  • adhdclinic

    Where do I put the copied code?

  • Micaelasosalaspiur

    No funciono!

  • FBSMOW

    We just changed the template of our Wordpress site and our jotforms no longer appear. I've used every embed code that you provide and none work. We do not have a paid subscription to add a plugin. Any suggestions?

  • AliAli1982

    Then What?

  • karimendoza

    DOES NOT WORK - I realllly reallly need someone to respond to my email sent please

  • theangette

    https://www.fearless-finances.com/application.html

    This is still not working and it is very frustrating that you guys do not have a human I can speak to on the phone.

  • theangette

    https://www.fearless-finances.com/application.html

    It is still not working.

  • Wingzy

    Thanks!!
    it worked

  • jgdunbar

    the page we have the link on is a sharepoint portal & it does not support IFRAME code. just the ulr which was working up till a few days ago. other forms we have posted are having the same issue.

  • Cambabes2018

    Hi my email is juicycambabes@outlook.com I can not seem to get the pay pal subscription payment working. Could you please help me ?

  • Tasha Martin

    The frame code does not work. Also the buttons that I put on the form doesn't work either. The Print button and the clear form button doesn't work. The only button that does work is the submit button.

  • Roz Grabitz

    I copied the Iframe code and pasted it on my website. What I ended up with were paragraphs of code - No readible form

  • HBFBBC

    it still does not work. this support is not helpful

  • HBFBBC

    I got your test. and not its not embeded.

    its just a link and I have had 3 ppl say they did it, but I never got anything!

  • marketsmedia

    My issue is with the poll redirect to at external page, I want the finding to appear in our already embedded site.

  • LRSPrivateTours

    I tried the iFrame code but it did not solve the problem of the 'Thank You' message box being a the top of the screen under the header instead of visible after the Submit button is clicked.

  • Nithyavasanth

    good

  • rghspace

    Still cannot reduce the height - is there a different icode to insert somewhere? I am completely puzzled.
    Robin

  • Wayne

    That has solved the problem.
    Thanks

  • HIOINDY

    That took care of it, thanks!

  • dominickyuh

    thanks

  • williamsinclair

    THIS IS AWESOME and it was so easy to do to help parents register children for camp from their smartphones (the straight "embed" code we were using only allowed the form to work on computers most of the time).

    thank you so much for your help!!!

  • Hans

    Hello,
    I have done the above and copied the Iframe. here below the result.
    =======================================================================================



    var ifr = document.getElementById("JotFormIFrame-80502426013341");
    if(window.location.href && window.location.href.indexOf("?") > -1) {
    var get = window.location.href.substr(window.location.href.indexOf("?") + 1);
    if(ifr && get.length > 0) {
    var src = ifr.src;
    src = src.indexOf("?") > -1 ? src + "&" + get : src + "?" + get;
    ifr.src = src;
    }
    }
    window.handleIFrameMessage = function(e) {
    var args = e.data.split(":");
    if (args.length > 2) { iframe = document.getElementById("JotFormIFrame-" + args[(args.length - 1)]); } else { iframe = document.getElementById("JotFormIFrame"); }
    if (!iframe) { return; }
    switch (args[0]) {
    case "scrollIntoView":
    iframe.scrollIntoView();
    break;
    case "setHeight":
    iframe.style.height = args[1] + "px";
    break;
    case "collapseErrorPage":
    if (iframe.clientHeight > window.innerHeight) {
    iframe.style.height = window.innerHeight + "px";
    }
    break;
    case "reloadPage":
    window.location.reload();
    break;
    case "loadScript":
    var src = args[1];
    if (args.length > 3) {
    src = args[1] + ':' + args[2];
    }
    var script = document.createElement('script');
    script.src = src;
    script.type = 'text/javascript';
    document.body.appendChild(script);
    break;
    case "exitFullscreen":
    if (window.document.exitFullscreen) window.document.exitFullscreen();
    else if (window.document.mozCancelFullScreen) window.document.mozCancelFullScreen();
    else if (window.document.mozCancelFullscreen) window.document.mozCancelFullScreen();
    else if (window.document.webkitExitFullscreen) window.document.webkitExitFullscreen();
    else if (window.document.msExitFullscreen) window.document.msExitFullscreen();
    break;
    }
    var isJotForm = (e.origin.indexOf("jotform") > -1) ? true : false;
    if(isJotForm && "contentWindow" in iframe && "postMessage" in iframe.contentWindow) {
    var urls = {"docurl":encodeURIComponent(document.URL),"referrer":encodeURIComponent(document.referrer)};
    iframe.contentWindow.postMessage(JSON.stringify({"type":"urls","value":urls}), "*");
    }
    };
    if (window.addEventListener) {
    window.addEventListener("message", handleIFrameMessage, false);
    } else if (window.attachEvent) {
    window.attachEvent("onmessage", handleIFrameMessage);
    }

    =======================================================================================

    Preview current internet page the form is visible.
    Preview of the entire website is the form not showing up!!!?
    I have tried this with 3 internet explorer, (internet explorer 11-Firefox-Opera). Results are the same.
    My website is in own environment in development and not yet visible on the internet.
    I hope someone can help me as soon as possible with a working solution.
    Best regards,
    Hans

  • rickcordisco

    This puts up a midget sized contact form. Not adjustable either. I used the actual code for Wordpress because I have a wordpress website and when i tested the form it is just not sending to my email to alert me that someone filled out the form.

  • MaisonClobert

    This is especially useful when integrating a Square payment option. The iFrame allows Square to work without the whole website having to be SSL certified (with HttpS pages)!

  • Adeth2016

    I followed al instruction but it did not work, reflect the same problem. Please send to me the all process

  • rhettgunter

    did not work

  • howieloo

    I need to know the width and how tall this form is suppose to be so it will work... I was told in a tutorial you guys sent me that it needs to be changed in order to view it properly

  • howieloo

    What is this iframe code you sent me? should I be using this code with my own iframe code?

  • LeightonV

    AWESOME!...Yep your iFrame advice worked like a charm...Thank you very much :)

  • kaptainsa

    Thank you unfortunately it will not let me delete the current code or insert the new code: How do I do that.

  • Royalchoudhary

    My problem is solved
    Thank you

  • René Benschop

    I tried to use IFRAME but it doesn't work. You can see on the site http://www.mspevents.nl/#xl_xr_page_boekingsformulier
    what I mean. The forms are on the site but are not steady!

  • jodyheath

    I always copy the iframe code. I had made no changes. The forms stopped loading, then they loaded slow, then they seem to be working atleast for now. I have made no changes.

  • russelldelman

    Once I have done all of these steps, do I need to do anything else? or is it automatic?

  • jarydcat1

    I did this and my form doesn't work. It shows up fine and lets me enter details, but when i hit the submit button, it stays on the Please Wait loading button and does nothing

  • Flyinfur

    I used the iFrame code and tested the form from a friend's computer. The form went through (I received the "thank you for your submission" message), but I didn't received an email with the form. What now?!

  • pinto25ji

    it worked flawlessly, very clear instructions. Thank you!

  • mamodelivers

    not open on mobile

  • kadir

    I Dont Like No Form Code Error Problem Answers

  • Steven Hannigan

    Hi
    This message is to Welden.
    What is wrong with my page embed code ???
    When I use the code off my webpage, the page loads no problem ?
    Also, until recently...this page worked just fine ! So, I dont understand how the code has suddenly become "Wrong" ???
    The exact code works on another page on my website ! The only difference between the 2 is that the other page is in Chinese !

    Also, the above "Embed Code" button on this page is absolutely useless !

    Steven