JotForm is a free online form builder which helps you create online forms without writing a single line of code. No sign-up required.
We believe that if one user has a question, there could be more users who may have the same question. This is why many of our support forum threads are public and available to be searched and viewed. If you’d like help immediately, feel free to search for a similar question, or submit your question or concern.
How can I make my form mobile responsive for my customers?Asked by GaryH123 on March 16, 2015 at 02:50 PM
I am having some trouble with customers having trouble filling out my forms.
iPhones and Android phones
How can I have it for everyone to see iPhones / Android phones / Computers
GJE, GJNE, GJT,
GSN, GSNE, GST,
What sort of trouble is happening when your customers are trying to fill in your form on mobile?
Can you please explain more to us about this issue so that we can better assist you.
Additionally, I took a look at your form and it looks normal and the same as your webpage. When I clicked on your jotform I was also able to use it fine as well.
Do you maybe mean that you want it to fit mobile devices? Or?
I would suggest making your form responsive in your preferences by setting responsive option to "yes" or alternatively you could try using our form responsive widget. Only use one of them.
If neither of those work then you may need to check your website cms for any sort of mobile settings because most likely since you have it embedded there might be some other tool either overriding it or you may have to enable it so that your site is responsive along with the form to use for mobile devices.
Everything's ok, viewing the form from my computers.
When I view it from my cell phone the form is cut off
JotForm Support Manager
Click on Preferences button.
On General Settings, set Responsive Form option to Yes
You can also use our new Form Designer tool if you want to add more styles to the form, and make your form responsive from there.
While on Edit mode, click the Form Designer Icon on the Form Style toolbar. (Pictured below)
On Form Layout click on Make This Form Responsive
Otherwise, by setting the option in Preferences will be enough.
The form will be viewable on both mobile phones, pads and computers.
I been following all of everyone's directions and I still am unable to get it right.
When I look at it on a computer the form is far left.
When I look at it on iPhone / Android everything is almost perfect
I did check your web page where you have embedded your form and I see the problem. Please check the screenshot below:
Here are the steps I would suggest you:
#1. It seems you have used your form's script embed code in your web page. For the forms to work properly in mobile devices, I would suggest you to embed your form with its iFrame embed code. The following guide should help you : https://www.jotform.com/help/148-Getting-the-Form-iFrame-Code
#2. Do test your web page if the iFrame embed code solves your issue. If the issue persists, please go ahead and inject the following custom css code in your form:
background: none !important;
The following guide should help you on how to inject custom css code in form: https://www.jotform.com/help/117-How-to-Inject-Custom-CSS-Codes
Hope this helps.
Do get back to us if you have any questions.
How do I inject this CSS code into the old code
I already know to go to Form Styles
I am not sure on where to add this code into the other code
background: none !important;
Viewing the code it's still short for an iPhone / Android Cell Phone
On a computer it's great
In order to inject the above css code you can just use this guide http://www.jotform.com/help/117-How-to-Inject-Custom-CSS-Codes as suggested above previously to show you how to do that.
You just need to add the line of code to the very bottom if there is existing code already there then just scroll way down and paste it.
How about deleting the entire list of questions that I wanted support to answer.
I am not sure if deleting all threads are allowed but you do you want to delete the threads? I have gone ahead and marked your last few threads as private. Now only JotForm support and you can access those threads. That should be an acceptable solution.