Form is not responsive

  • Profile Image
    simoncav
    Asked on February 21, 2016 at 06:29 AM

    Hi there,

    I've built a form called "Mothers Day Competition 2016" which is embedded on the following page:

    https://beegood.co.uk/pages/mothers-day-competition

    The problem is that the form itself is no longer responsive.  It was when I first installed it and it has both the responsive option ticked in the form design area as well as having the mobile responsive widget installed in the form.

    Can you please advise how to make the form resize correctly when viewed from a mobile device?

    Thanks

    Simon

    Bee Good Ltd

  • Profile Image
    ashwin_d
    Answered on February 21, 2016 at 11:48 AM

    Hello Simon,

    I did check your webpage where you have embedded your form and found that you have used script embed code. For forms to be responsive, we recommend to embed your form using its iFrame embed code. 

    Please go ahead and embed your form using its iFrame embed code and that should solve your problem. The following guide should help you grab your form's iFrame embed code:  http://www.jotform.com/help/148-Getting-the-Form-iFrame-Code 

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

    Thank you!

  • Profile Image
    simoncav
    Answered on February 21, 2016 at 12:33 PM

    Tried that and it seems to make no difference... Had previously followed the Shopify specific instructions and that did not work either...

     

    Simon

  • Profile Image
    jonathan
    Answered on February 21, 2016 at 02:47 PM

    I was able to see the issue as well when I test the form http://www.jotformpro.com/form/60422896974973 in your website 

    Let me do some investigation on what could be causing the issue. I will get back to you shortly.

     

     

     

     

  • Profile Image
    jonathan
    Answered on February 21, 2016 at 03:00 PM

    Can you please try also re-embedding the form using its iframe code BUT leave the script code part of the embed code you get from PUBLISH button.

    Example, try this code directly

     

        <iframe

          id="JotFormIFrame"

          onload="window.parent.scrollTo(0,0)"

          allowtransparency="true"

          src="https://form.jotform.com/60422896974973"

          frameborder="0"

          style="width:100%;

          height:704px;

          border:none;"

          scrolling="no">

        </iframe>

        

     

    Make sure you remove first any previous existing embed code of the form on your website before you add the code above.

    Please let us know how it goes

     

     

  • Profile Image
    simoncav
    Answered on February 21, 2016 at 04:33 PM

    Hi Jonathan,

    Thanks for that, strange - it's working on an Android phone running Chrome but not on an iPhone running either Chrome or Safari...

    Simon

     

  • Profile Image
    jonathan
    Answered on February 21, 2016 at 05:17 PM

    Simon,

    I made a reset of your form http://www.jotformpro.com/form/60422896974973 theme templae styles and it seems to have fixed the issue. I see it working properly on the website now.

    Can you please check also on your end. Let us know if still not working

     

  • Profile Image
    simoncav
    Answered on February 21, 2016 at 05:31 PM

    Thanks Jonathan,

    That seems to have fixed it!

    Fantastic support - Thanks so much.

    Simon

     

  • Profile Image
    ashwin_d
    Answered on February 21, 2016 at 09:19 PM

    Hello Simon,

    On behalf of my colleague, you are welcome.

    I am glad to know that your issue is resolved.

    Do get back to us if you have any questions.

    Thank you!