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

    How can I embed my form so it fits properly onto my site?

    Asked by gmehlhoff on January 31, 2014 at 05:08 PM

    Hello,

    I'm trying to create a registration page for a conference my organization is putting together. My problem is that my form keeps getting cut off on the right margin even after I change my form's width on Jot Form. Do you guys have any ideas on how to make it fit properly?

     

    My Form: http://form.jotform.us/form/40305398362151

    Page URL:
    http://alztex.org/forms/proconf14google.asp

    Screenshot
    site JotForm problem create hello
  • Profile Image

    Answered by Carina on January 31, 2014 at 06:08 PM

    Hello

    What kind of embedding option are you using? Have you tried iframe?

    Thanks

  • Profile Image

    Answered by gmehlhoff on January 31, 2014 at 06:15 PM

    I just did try the iframe embed with the same results. Any other ideas?

  • Profile Image

    Answered by Carina on January 31, 2014 at 08:30 PM

    Hello:

    Please try to embed your form through iframe by using this code instead:


    <iframe id="JotFormIFrame" onload="window.parent.scrollTo(0,0)" allowtransparency="true" src="//form.jotformpro.com/form/40306823772958" frameborder="0" style="width:536px; height:1697px; border:none;" scrolling="no"></iframe>

     

    I changed the width from the original "100%" value to "535px". I also realized that the form image header is 635 px, my suggestion would be to resize the image to 535px, because otherwise resizing the iframe to 635px would cause the form to be out of alignment with the rest of the site:

    And not resizing the image would make the form to show properly, but the header to show cropped.

    I also recommend you to inject the following css code:

     

    #content {
    padding-left: 0;
    width: 553px;
    }

    .JotFormIFrame {
    width: 553px;
    }

    Please check our guide on how to inject custom css for more details on this subject.

    Kindly let us know if you need more assistance.

     

  • Profile Image

    Answered by gmehlhoff on February 03, 2014 at 11:01 AM

    Thank you! The form fits perfectly now!

     

    Grant