How to use lightbox form on mobile browser?

  • ANDROSS
    Asked on April 17, 2017 at 3:41 PM
    While using my desktop computer, I also changed the browser's viewport to a smartphone size (and tested the form on my phone, too) and noticed the form is not responsive, it's too large for the smaller screen. I'm pretty sure I used fixed width and height dimensions when building the form. I will see what I can do to make the form mobile friendly. If you have any suggestions, please let me know.
  • Kiran Support Team Lead
    Replied on April 17, 2017 at 3:58 PM

    Please be noted that the lightbox view of the form is also mobile responsive now. As I check your web page on a mobile emulator, I see that the form is not displaying correctly on the lightbox. It looks like the form itself is not displaying correctly on mobile devices when the direct URL of the form is used. This seems to be caused by the fields that are set to Shrink from the field properties.

    How to use lightbox form on mobile browser? Image 1 Screenshot 20

    Please try disabling the Shrink option for the fields on your form and it should be displaying normally on the mobile devices and so as in the lightbox.

    Please get back to us if the issue still persists. We will be happy to assist. 

  • ANDROSS
    Replied on April 17, 2017 at 4:23 PM

    Thanks, I turned off the Shrink options for all the fields then saved and pasted the code into my developer environment,

    http://www.norelcosafecam.com/Dev/

    Now that the fields do not shrink, I think they are even more difficult to see since they remain "stretched" and no longer shrink.

    Also, if I press CTRL + SHIFT + I on my keyboard to open the Console, I see a number of Uncaught TypeError: messages.

    Is the Lightbox actually responsive? I'd like my form to be mobile friendly, thank you kindly.

     

     

  • Kiran Support Team Lead
    Replied on April 17, 2017 at 4:49 PM

    Yes. The form displayed in the Lightbox should be responsive and it is working fine as I check at my end. You may also check the responsive lightbox from the Publish wizard by clicking on Lightbox and then Preview to test.

    How to use lightbox form on mobile browser? Image 1 Screenshot 20

    It looks like the issue is being caused by changing the filename to feedback.js in the code or any conflict with the other scripts on the web page. Could you try changing the feedback.js to feedback2.js and check if the issue still persists?

    Please get back to us if you need any further assistance. We will be happy to assist.