Width of embedded form is very small.

  • Profile Image
    kantime
    Asked on May 29, 2017 at 02:45 PM

    I am using the standard copy/paste embed javascript method to put this form on a WordPress page. 

    The webpage container is 960px.

    The form's width is programmed at 600px.

    The iframe on the page is measuring at 300px wide.

    It should be filling the entire width of the container (as in the form's preview).

    Same issue in Chrome, FF, IE.

    Please check out this form and please advise how to fix the width on this form.

    Thanks!

     

  • Profile Image
    ashwin_d
    Answered on May 29, 2017 at 03:19 PM

    Hello,

    I would suggest you to please re-embed your form using its iFrame embed code and see if that solves your problem. Please use the following iFrame embed code:

     <iframe id="JotFormIFrame-71485346444158" onload="window.parent.scrollTo(0,0)" allowtransparency="true" src="https://form.jotform.us/71485346444158" frameborder="0" style="width:600px; height:539px; border:none;" scrolling="no"> </iframe>

    <script type="text/javascript"> var ifr = document.getElementById("JotFormIFrame-71485346444158"); 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>

    Hope this helps.

    Do get back to us if you have any questions.

    Thank you!

  • Profile Image
    kantime
    Answered on June 05, 2017 at 12:18 PM

    Worked like a charm, Thanks!