Getting the Form iFrame Code

Last Update: August 11, 2015

iFrames are used commonly 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 out here.

Copy the iFrame Code 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 Embed Form in the top toolbar

2. Select iFrame in the Embed Form Wizard

3. Copy the provided codes

Note when using the iFrame version: Every time you change your form, you must update the form code on your site. This is because the height of the form needs to be hard-coded. If the form size changes, the iFrameheight will need to be updated.

You can adjust the Iframe height directly on the Iframe code, as indicated below, to match the new height of your form: 

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


david2971688 (April 17, 2012 at 01:16 AM)

None of those works,
even iFrame

View Answer

Joedaiches (August 31, 2012 at 01:29 PM)

the iframe turns into a very tall skinny image on the page how do i change the size of the iframe?

View Answer

dinomew (October 30, 2012 at 09:47 AM)

This didn't work for me either. Form is still blank.

View Answer

Beth (December 21, 2012 at 07:29 AM)

what do I do after I click copy? to where?

View Answer

Beth (December 21, 2012 at 07:29 AM)

what do I do after I click copy? to where?

elizteo (January 26, 2013 at 07:21 PM)

I am presently using inframe code. Does that mean I am using the normal http which does not retrict me from 10 SSL submission.

View Answer

rollbackskating (March 01, 2013 at 08:27 AM)

I have no scroll bar on my form although i have scrolling set to 'yes'.

What to do?

View Answer

sebastian marcet (March 04, 2013 at 09:21 AM)

i am trying to embed my code on an iframe, but seems that iframe code breaks the same origin policy access bc jotfrom js code its throwing "Permission denied to access property 'FrameBuilder' " error
method :putImageonform
line 954
please help

sebastian marcet (March 04, 2013 at 09:41 AM)

nm, found the solution using


earthdaysf (March 19, 2013 at 04:23 PM)


-several people on this page mention errors they received using the iframe method. JotForm support has not yet replied to these errors.

-the image in this page is broken.

-when i use the iframe method, the iframe height is much larger than it needs to be.

-The script method should be able to scroll up automatically, since it is script.

View Answer

earthdaysf (March 19, 2013 at 04:25 PM)

the width of the iframe is much wider than it needs to be-- it's wider than the web-page where i'm putting the form.

View Answer

Daniel Schultka (July 10, 2013 at 08:09 AM)

Problem solved with iframe code.


guiddini (November 27, 2013 at 03:31 AM)

i dont like this answers

ledalim (December 08, 2013 at 04:28 PM)

And where is the image saved to? It's lacking o coherent steps, unfortunately.

View Answer

prit1 (December 26, 2013 at 05:24 AM)

I want to change the height and width of form along with textbox height and width..i m able to change form width but unable to change textbox width..could u help me?

View Answer

gpeppy (January 24, 2014 at 11:06 AM)

Hi, I just get a blank area when I use iFrame

View Answer

pauldjoyce (May 02, 2014 at 07:16 AM)

Hi-as per gpeppy (just above), I just get a blank area when I use iFrame. I've tried viewing the answer that gpeppy got bu the webpage doesn't open.

View Answer

Sameer (June 20, 2014 at 02:41 PM)

IFRAME doesnt work for me.
I am using website builder 7 from Godaddy.

Please help!!

View Answer

macssam (July 07, 2014 at 05:29 PM)

do I have to copy both codes
where does each code go ...

View Answer

ndidinwange (December 06, 2014 at 10:39 PM)

Iframe didnt work for me either. I'm using godaddy website builder 7. Jotform pls help if you're reading this

View Answer

benbftg (February 15, 2015 at 09:09 PM)

I tried iframe and it didn't work. I'm using adobe muse. The transparent back ground also didn't work. I had cloned a form that your tech support had changed the background color in the css script. I double checked the clone in a text editor and the background color shows .supernova body {
background-color: transparent;
Then I saved the form and went into iframe. It wasn't transparent and the form itself could not be edited in height on the html

View Answer

jtamboer (February 23, 2015 at 09:47 AM)

iFrame code did not enable the form on a mobile device for me. iFrame form displays just fine on Chrome and Explorer. Mobile device shows blank area, and the device tries to load the page constantly.

View Answer

whatsintheboxparties (April 23, 2015 at 09:56 PM)

Why did you just send me a rehashed solution which obviously doesn't work.

Reading through the comments regarding this solution they all say that it doesn't work and not surprisingly when I tried the iframe code again (I had already tried this before I posted my question) it doesn't work either.

So can you please give me a solution that works? That would be greatly appreciated.

Thank you!

View Answer

Nicholas (July 20, 2015 at 08:01 AM)

when i paste the below code on my web page and save.

window.handleIFrameMessage = function(e) {var args =":");var iframe = document.getElementById("JotFormIFrame");if (!iframe)return;switch (args[0]) {case "scrollIntoView":iframe.scrollIntoView();break;case "setHeight" = args[1] + "px";break;case "collapseErrorPage":if (iframe.clientHeight > window.innerHeight) { = window.innerHeight + "px";}break;case "reloadPage":window.location.reload();break;}};if (window.addEventListener) {window.addEventListener("message", handleIFrameMessage, false);} else if (window.attachEvent) {window.attachEvent("onmessage", handleIFrameMessage);}

after i save, the below appear on my web page instead of the form, what im i doing wrong, pls help.

// window.innerHeight) { = window.innerHeight + "px";}break;case "reloadPage":window.location.reload();break;}};if (window.addEventListener) {window.addEventListener("message", handleIFrameMessage, false);} else if (window.attachEvent) {window.attachEvent("onmessage", handleIFrameMessage);} // ]]>

View Answer

abteilung (August 11, 2015 at 06:14 PM)

I have a problem with my form not showing up on some Macs / OS X / ipads. After I have used the embed-method for my joomla site until now, I read about the iframe-workaround for my problem.
So I updated Joomla (3.4.3), installed Sourcerer (5.0.2) and updated my Module with the iframe-Code (replaced the embed-code). After this unfortunately the form only shows half.
After checking CSS I can see height of my form is set to 180px. But in the code I pasted into Sourcerer it states this:

style="width:100%; height:2064px;

What I am missing?

Thanks a lot!

View Answer

Jared (August 13, 2015 at 04:31 PM)

Worked great for me, thanks!

Send Comment