Source Code vs Embed Form - iFrame

  • leonip
    Asked on July 14, 2015 at 10:03 PM

    Hi,

    I am a user of Shopify.  I inserted the Source Code generated by JotForm (as illustrated below) on the new template but then I got the double headers:

    <script type="text/javascript" src="http://form.jotform.me/jsform/51898092406463"></script>
     
    I tried many other ways without success until I inserted the iFrame under Embed Form (as illustrated below) on the new template and I got what I have now:
     
    <iframe id="JotFormIFrame" onDISABLEDload="window.parent.scrollTo(0,0)" allowtransparency="true" src="http://form.jotform.me/form/51898092406463" frameborder="0" style="width:99%; height:1315px; border:none;" scrolling="no"></iframe>
    <script type="text/javascript">window.handleIFrameMessage = function(e) {var args = e.data.split(":");var 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;}};if (window.addEventListener) {window.addEventListener("message", handleIFrameMessage, false);} else if (window.attachEvent) {window.attachEvent("onmessage", handleIFrameMessage);}</script>

    Can you elaborate the difference between the two.

    To access myshopify webpage http://starrich.myshopify.com/pages/selling-used-gse, the password is fok, this free-trial will end in 3 days time.

    Regards

    Leon

    Jotform Thread 610300 Screenshot
  • Charlie
    Replied on July 15, 2015 at 3:12 AM

    Hi,

    You can check this guide on what embed code you can use: http://www.jotform.com/help/67-Which-Form-Embed-Code-Should-I-Use.

    Depending on the website and platform you have, basically the "Source code" found in the form builder is just the default embed code for easy access.

    Source Code vs Embed Form iFrame Image 1 Screenshot 30

    If the default embed code doesn't work in your website or platform, you can check our "Embed Form" options to use different embed code instead.

    Source Code vs Embed Form iFrame Image 2 Screenshot 41

     

    Now for your question, the iFrame embed code is usually used when there's a code conflict between your website and the form, causing some problems like form not working as expected or styling issues. If you use the iFrame code, external sources will not affect the form inside it.

    I hope that helps. Do let us know if you need more information on this.

    Thanks.

  • leonip
    Replied on July 15, 2015 at 3:33 AM
    Many thanks!
    ...
  • BJoanna
    Replied on July 15, 2015 at 4:14 AM

    On behalf of my colleague, you are welcome.

    Feel free to contact us if you have any other questions.