1&1 Website: My embeded form does not show on mobile devices?

  • Profile Image
    ECD2013
    Asked on June 22, 2017 at 02:28 PM
  • Profile Image
    ashwin_d
    Answered on June 22, 2017 at 02:55 PM

    Hello ECD2013,

    Please note that for your embedded form to be mobile responsive, we recommend to embed form using its iFrame embed code. I did check your webpage and found that you have used your form's script code. I would suggest you to please embed your form using its iFrame embed code and that should solve your problem. The following guide should help you how to grab your form's iFrame embed code:  https://www.jotform.com/help/148-Getting-the-form-iFrame-code

    Hope this helps.

    Do try it out and get back to us if the issue persists.

    Thank you!

  • Profile Image
    ECD2013
    Answered on June 22, 2017 at 03:44 PM
    This still doesn't work.
    Get Outlook for iOS
    ________________________________
    ...
  • Profile Image
    Sven
    Answered on June 22, 2017 at 04:14 PM

    I checked your webpage on a mobile device and I was able to view it without issues, please see:

     

    Can you please explain a bit further what is the issue you're facing so we can troubleshoot, as I have just checked and I couldn't find any issues.

  • Profile Image
    ECD2013
    Answered on June 22, 2017 at 04:43 PM
    That is the wrong page,
    https://www.trinitymissionarychurch.org/vbs-2017/
    ...
  • Profile Image
    Sven
    Answered on June 22, 2017 at 04:52 PM

    Apologies for the confusion.

    Can you change the embedding code into the following code:

     

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

     

    I have just tested this on my test page and it worked without issues, please let us know if the issue still persists. 

  • Profile Image
    ECD2013
    Answered on June 22, 2017 at 05:43 PM
    Still no luck. All I get is the left side bar.
    Get Outlook for iOS
    ________________________________
    ...
  • Profile Image
    david
    Answered on June 22, 2017 at 06:37 PM

    I checked your page on mobile and the form did load on my end:

    Is it still not showing on yours?  I checked a couple different devices and the embedded form loaded on both.

  • Profile Image
    ECD2013
    Answered on June 22, 2017 at 07:43 PM
    Still not showing up. We have tried on iPhone 6, 7, and SE here is all we get.[Image]
    Get Outlook for iOS
    ________________________________
    ...
  • Profile Image
    Mike
    Answered on June 22, 2017 at 08:07 PM

    It appears that 1&1 builder hides embedded content on mobile websites.

    You can try to un-check the option called 'Only display optimized content on smartphones and tablets' via Settings > MyWebsite Mobile at 1&1.

    Thank you.

  • Profile Image
    ECD2013
    Answered on June 22, 2017 at 09:43 PM
    Looks like that did it!!! Thank you for all of your help!!!
    ...
  • Profile Image
    WilliamR
    Answered on June 22, 2017 at 09:59 PM

    Glad to know that it works. Should you have any other concerns, feel free to contact us anytime.