How to make forms mobile responsive

Last Update: May 24, 2016

If you are looking for a way to make your forms to appear more user-friendly across different devices like smartphones and tablets, here is how:

1. While on Edit mode, click the Designer button found on the top toolbar.


2. On Form Layout  section, check the Make This Form Responsive option


3. That's it. Your form should become fully responsive when you check it on different devices.

In addition, we have lots of ready to use mobile responsive themes at our Theme Store that you can use for free! 

To see them check this link out: http://www.jotform.com/theme-store/collection/mobile


17 Comments...


   
farmgrove (February 06, 2015 at 02:31 AM)

I have used the purchase order and whilst the form is responsive on the pc, it's not on tablet or ipad - how can I rectify this please ?

View Answer


   
Mat (February 22, 2015 at 12:02 PM)

Is there a description of what "Make this form responsive" does? Eg, what are the breakpoints and what formatting happens at these breakpoints?
Thanks.

View Answer


   
tpbauer01 (March 12, 2015 at 04:57 PM)

Good work. THANK YOU!!


   
Eric (April 03, 2015 at 11:07 AM)

Thanks ! I had done the preferences - responsive already, but was unaware of the designer aspect. Will see how that goes.


   
NekoStudios (April 25, 2015 at 11:30 PM)

I'm viewing my form through the form's link, not my website (not embedded yet), and it looks a mess. I am extremely saddened by this as my forms are awesome and took a lot of time to create. My main issue is the fact that the conditions are not working. I will be satisfied with however it looks through mobile as long as the conditions work. Very important! Help me, please :)

https://secure.jotform.us/NekoStudios/socialmediaservices1

View Answer


   
GentlemensAgency (June 04, 2015 at 12:41 PM)

It didn't work for me, I have done everything from the instructions. Also I did re-embed the iframe code. But on IOS it is still a mess.

View Answer


   
DigitalWebResults (September 09, 2015 at 10:26 AM)

I have tried every idea I have seen in the forums on multiple threads and can't get it to work. I am using Xara Designer Pro X11 and when I embed the form on the main and mobile variants and then preview, one of the variants has no JotForm. Any suggestions? I have tried inserting placeholder, inserting code into jotform, making sure form is set to responsive design at both locations where that setting can be changed. Here is my website www.digitalwebresults.com
Please use mmadson@ymail.com for response.

View Answer


   
Kishan (October 13, 2015 at 10:47 PM)

Hi, I am creating a form that I plan to use for a health survey. Have a few questions please:

1) i don't want the form to be on a website. Instead, my team will examine patients and fill up a form per patient via an ipad. Is that possible?

2) can I have multiple members from my team access the same form and fill it so it all gets added to the same data base.

3) post review, we want to share a copy of the report with patients and hospital staff. Is that possible and can I design the report separately?

Thanks

View Answer


   
caam_ayurveda (October 25, 2015 at 01:04 PM)

Hi, I tried the recommendation above but the page is still cut off on the mobile phone. I'm using Safari on my iphone to test.

View Answer


   
Paulina (November 24, 2015 at 02:22 PM)

Hi, I followed the instructions in the user guide to see the form on mobile but simply not seen. What can I do?

View Answer


   
sonusudeep (January 26, 2016 at 03:17 AM)

i have seen all the tutorials how to create a form but don't know how to convert my webpage into mobile friendly app .
any advies ?
please...

View Answer


   
dcavalli (April 28, 2016 at 03:30 PM)

Does this apply for Google sites? If so, I made the change and it still is not viewing correctly.

View Answer


   
mhew (August 24, 2016 at 09:30 AM)

I'm using jotforms to make a popup lightbox for users to read my policies. Unfortunately, when I view it mobile (using the lightbox embed code) it is not adapting the lightbox window size in mobile. If a user clicks on this embed link on a mobile device, they will get stuck on it and can't "X" out from the popup. Nor can they even read the pop-up because it goes beyond the screen constraints and gets cut off. It works beautifully on desktop, but more and more people are viewing sites on mobile, so I really need this feature. Is there some way for me to get this working?
My website is http://paintlifegrandparties.weebly.com/parties.html and the link is at the bottom of the page and reads "Policies & Cancellation".
Thanks!

View Answer


   
miohonda (August 30, 2016 at 10:56 PM)

I already have this checked but my form does not appear to be responsive when opened from my iphone.

I am guessing that this is because I customized the CSS, but I don't know how I can fix this without changing the layout of the PC version.

Can you please help me fix this?

https://form.jotform.me/62418076663460

View Answer


   
AuDo (September 29, 2016 at 07:40 PM)

It's not working for me also.

View Answer


   
gopanache (October 20, 2016 at 01:40 PM)

Your answer does not work. This is a VERY POOR experience for customers and embarrassing to use.

View Answer


   
waynenoel (November 12, 2016 at 03:56 PM)

Still no response?

View Answer


Send Comment