WordPress embedded form not showing on mobile

  • Profile Image
    crystalclearimages4u
    Asked on September 14, 2015 at 10:49 PM
    I am using the Wordpress Widget. In addition, the form is not showing up on mobile devices.
  • Profile Image
    Chriistian
    Answered on September 14, 2015 at 11:06 PM

    Hi,

     

    I checked your form's mobile responsiveness and I noticed that form is not properly displayed.

     

    Can you try to re-embed your form using the iFrame embed method instead of using the Wordpress plugin? To get the iFrame embed code of your form, just follow the instruction provided in this article: Getting the Form iFrameCode.

     

    Do let us know if you need further assistance.

     

    Regards.

  • Profile Image
    crystalclearimages4u
    Answered on September 14, 2015 at 11:59 PM

    Thank you, I tried that and it looks the same :(

  • Profile Image
    Chriistian
    Answered on September 15, 2015 at 01:44 AM

    Hi,

     

    I did checked your page and noticed that it is still in the script method.

    Can you try to embed your form using iFrame embed method and retain it on iFrame embed method so we can further investigate the issue?

     

    We will wait for your response.

     

    Regards.

  • Profile Image
    crystalclearimages4u
    Answered on September 15, 2015 at 10:30 AM

    Sorry, yes I changed it back because I was trying other things. I have now updated it back to the iFrame embed method for you.

  • Profile Image
    Ben
    Answered on September 15, 2015 at 01:15 PM

    I took a look at your page and I see that the iframe embed code is there now, but I do see that the issue is caused by something on your mobile template causing the iframe to be resized to 150px - which makes it show only the header and nothing else to it.

    To resolve this you could set the CSS of your form with a code such as this:

    @media screen and (max-width:768px) {
        #JotFormIFrame {
            min-height: 4950px;
        }
    }

    This will set it to be of the right size for the mobile phone and will leave the desktop version as it is.

    Now, since the 3rd page is the longest, that is why such a long height would be needed, otherwise around 800px would be needed for the first 2 pages.

    Do add the code above at your website and test it then and let us know how it goes.

  • Profile Image
    crystalclearimages4u
    Answered on September 15, 2015 at 02:22 PM

    Im sorry, but I don't know where exactly to put that code...?

  • Profile Image
    crystalclearimages4u
    Answered on September 15, 2015 at 02:47 PM
    I'm sorry, I'm not sure where to add that code
    ...
  • Profile Image
    Ben
    Answered on September 15, 2015 at 04:44 PM

    My suggestion would be to take a look at the following blog here.

    The first segment is on the Blogger, but after it you will see the segment on WordPress, which will show you several different options to do the same.

    Basically the code should be added to your website and once added, it should work, but do keep us updated on how it goes.

  • Profile Image
    crystalclearimages4u
    Answered on September 15, 2015 at 05:04 PM

    Thank you! That worked :)

  • Profile Image
    Boris
    Answered on September 15, 2015 at 08:31 PM

    On behalf of my colleagues, you are most welcome. Thank you for letting us know that the provided solution worked as intended.

    Please don't hesitate to contact us again if you run into any other issues with your forms, we will be happy to help.