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

    All I would like to do is collect email addresses..nothing more

    Asked by ismaeladrian on May 01, 2013 at 09:52 AM

    Hi guys,

    I am interested in the tiniest form possible.. something that would fit inside of a 355x68 rectangular box.. It doesn't have to be exact, but what I don't want is a big blocky contact form just to collect an email address.

    Is this possible? Most of my Jotforms are large and bulky making it difficult to integrate neatly on a page without taking up most of the space.  I usually have to create around the form, not the other way around.  

    I provided a makeshift example for you to get an idea of what I'm looking to do..

    Thank you so much!

    Ish

    email contact form height jpg
  • Profile Image

    Answered by jefreylandicho on May 01, 2013 at 10:18 AM

    Yes that is likely possible, you can adjust the form width size and label size in the Form Style Menu. By adjusting the label width and field width, you will be able to display the label and field inline even when the form width gets smaller.

    To adjust the field label size, select the field then click the Properties tab and Size Icon.

    Then insert the embed code inside a div tag e.g.

     

    <div style="width:355px">

    <!-- insert embed tag here -->

    </div>

     

    When you preview the form, it will cover the entire page, that is the reason we need to add a div tag.

    Below is the result I got when the form is not inside a div.

    Once embedded and inside a div tag, you will see that the form will adjust on your div width. The form width and div tag value should atleast be equal or the div tag is slightly larger.

    Another way to control the form width, label and field size is by injecting a Custom CSS in your Form styles. Click here to find out how to inject a custom css in your form styles.

    To adjust the label positioning, you can add this code in your Form Styles.

    .form-label-left {

    position: relative;

    top: -12px; /* up and down of label position */

    }

    If you need further assistance, please contact us again.

  • Profile Image

    Answered by pinoytech on May 01, 2013 at 10:27 AM

    Hi Ish,

    Can you please take a look at this demo form that I've created if this is what you want to achieve?

    http://www.jotformpro.com/form/31204104009940

    If you need further assistance, do let us know.

    Thank you!

  • Profile Image

    Answered by ismaeladrian on May 01, 2013 at 10:32 AM

    I love Jotform support.

    Yes, that demo looks about right although i can't detect where the borders are since the whole page is black.

    But as long as it's somewhat small and rectangular, that would be all I need.

  • Profile Image

    Answered by pinoytech on May 01, 2013 at 10:41 AM

    Glad to hear that Ish! Feel free to clone the form that I've made. In order for you to have the control of adjusting the height of the form, please embed it using iFrame method.

    If you need further assistance, do let us know.

    Thank you!