What is JotForm?
JotForm is a free online form builder which helps you create online forms without writing a single line of code. No sign-up required.

At JotForm, we want to make sure that you’re getting the online form builder help that you need. Our friendly customer support team is available 24/7.

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.


  • Profile Image

    One Form on two layouts?

    Asked by ipbr21054 on April 16, 2015 at 10:26 AM

    I currently use a form which shows portrait on the PC, IPAD & IPHONE.

    Is it possible to use the same form but have it show portrait on the IPHONE but landscape for the PC & IPAD.

    The form in question is 50907214204344

     

    Please advise.

    layouts one form ipad pc same form landscape
  • Profile Image
    JotForm Support

    Answered by Charlie on April 16, 2015 at 12:40 PM

    Hi,

    I'm not sure what you meant on portrait and landscape. The form actually adjust the width and height of the form fields depending on the where it is being viewed, so if the display of the device has a longer width and a shorter height (landscape orientation), then it will adjust the form fields to match the screen.

    If you are looking on how to make the form mobile responsive, then you can do that by following this guide: http://www.jotform.com/help/311-How-to-make-Forms-Mobile-Responsive.

    You can further check the display of the form by "Previewing" it on the Form Designer Tool.

    1. Click the "Designer" in the form builder.

    2. Click "Preview Form".

    3. You'll see how the form will looked like in different device display.

     

    I hope this helps. Do let us know if you need more information on this.

    Kind regards.

  • Profile Image

    Answered by ipbr21054 on April 16, 2015 at 01:48 PM

    I have done what you advised above but no change on any item at all.

    Pc iphone & ipad all show vertical/portrait view.

    Please check as by selecting "make it responsive" etc no noticeable change was shown.

     

    I have attached my example for my views as per post title.

    I have edited this form 40122641705342

    When i view this form on iphone i would like to see it like example shown below.

    When i view this form on ipad & pc i would like to see it like example shown below.

  • Profile Image
    JotForm Support

    Answered by Charlie on April 16, 2015 at 03:01 PM

    Hi,

    Upon checking your form: http://www.jotformeu.com/form/40122641705342, I see that you have not enabled the "Make this form responsive" option inside the Form Designer Tool.

    Your custom CSS codes also have errors.

     

    I've cloned your form and edited it in my end, here it is: http://form.jotformpro.com/form/51055779789979. See if that one works, if it does, you can clone it and make further changes to it. Here's a guide on how to clone a form: http://www.jotform.com/help/42-How-to-Clone-an-Existing-Form-from-a-URL 

    Also, may I know if your form is embedded on a website? Or is the form not being mobile responsive even viewing the direct link or the form's URL?

    Kind regards

  • Profile Image

    Answered by ipbr21054 on April 16, 2015 at 03:12 PM

    Still no change.

    Looking at the different view "top right of screen" the layout is the same.

    Looking at my example yellow image will the form adjust like example when screen rotated ?

  • Profile Image
    JotForm Support

    Answered by Charlie on April 16, 2015 at 03:57 PM

    Hi,

    I get it now, there was a little confusion. The form won't change to the Desktop layout because that form is created already like this:

     

    It is forced to look like a mobile display, showing all the fields in a tight column and one field per line. You need to manually re-position the form fields, change the width to match the layout for the desktop or larger displays you are looking for.

    These are the things you can do, but I would recommend that you clone your form for testing purposes, or you can clone mine at the bottom:

    1. Find the custom CSS code that you do not like or that will adjust the positions that you need.

    2. OR you can delete the custom CSS code so that you can have a fresh start to design:

    3. After you get a reset on the design, you can position the fields. Here's a guide on how to position them: http://www.jotform.com/help/90-Form-Field-Positioning 

    Here's my cloned form without the custom CSS code and made some re-positioning of the fields, you should see how the form changes to mobile view, because here originally the form by default is displayed in a layout for desktop: http://form.jotformpro.com/form/51055779789979 

    I hope this helps.

    Kind regards.