Iframe not showing all the form

  • Profile Image
    fabsob
    Asked on June 01, 2017 at 02:40 AM

    We have embeded a form on a WP with Iframe. Only the first half of the form is visible. Is there a general fix to this?

    (We have tried the WP plugin, but it is not stable on all browsers)

  • Profile Image
    Charlie
    Answered on June 01, 2017 at 03:10 AM

    Hi,

    If you are embedding the form using the iFrame embed code, you need to adjust the height attribute in the iframe code. Here's an example iframe embed code and where to find the height attribute:

     <iframe id="JotFormIFrame-71511869968977" onload="window.parent.scrollTo(0,0)" allowtransparency="true" src="https://form.jotformpro.com/71511869968977" frameborder="0" style="width:100%; height:539px; border:none;" scrolling="no"> </iframe> <script type="text/javascript"> var ifr = document.getElementById("JotFormIFrame-71511869968977"); 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[2]); } 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; } 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); } </script>

     

    May I also know if you have tried the suggestions listed in this guide: https://www.jotform.com/help/324-A-guide-to-forms-for-WordPress-users. We have different ways on how you can embed your form to Wordpress. I see you mentioned you used a plugin, we have two plugins you can try, JotForm Embed Plugin and JotForm oEmbed Plugin, please try the plugins one at a time.

    Let us know if the suggestions above worked.