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

    Can an HTML image be placed next to a label using the Form Builder?

    Asked by kokaneepowerforms on May 26, 2012 at 07:55 PM

    I've built a number of forms but I can't see a way to place an image next to an label object using the Form builder.   I'd like to do it through that mechanism so I don't have to much with the HTML directly as it seems once you manually mess with it directly then you have to own it from that point forward outside the Form builder.

  • Profile Image
    JotForm Support

    Answered by idarktech on May 26, 2012 at 09:06 PM

    Hi,

    Are you referring to field positioning? If not, then I believed that can be done with Custom CSS Injection.

    Please provide to us the form URL and give us more details on positioning these fields so we can help you further with this. Thanks!

  • Profile Image

    Answered by kokaneepowerforms on May 27, 2012 at 01:15 AM

    Here's an example form... one of about eight where I have our logo on top but want it next to the Heading object (currently below it) on the left as it would look a lot better.

    http://form.jotform.us/form/20840752537151

  • Profile Image
    JotForm Support

    Answered by abajan on May 27, 2012 at 09:25 AM

    Here's one solution:

    1. Load the form into the form builder

    2. Click the Form Style tab > Form Width button > increase the value to 687

    3. Inject the following CSS:

    #cid_10 .form-header-group {
    margin-top: -85px;
    width: 560px;
    float: right;
    }
    #id_33 {
    float: left;
    padding: 0;
    }
    .form-subHeader {
    font-size: 80%;
    font-style: normal;
    }
    #id_32 {
    padding-left: 61px;
    }

    4. Save the form

    If you need additional help with this, please let us know.

  • Profile Image

    Answered by kokaneepowerforms on May 28, 2012 at 08:03 PM

    Tks Abajan - That works and gave me the info so I could do the same in my other forms that had slightly different class id's.  

    One suggestion that would be nice is to include the class id's in the properties listing of controls / widgets.  The current method to determine these requires a good look at the source to derive them and exposing them could be something to help review them faster.

    Once again appreciate the help.  You guys/gals are great!

  • Profile Image
    JotForm Support

    Answered by jonathan on May 28, 2012 at 08:59 PM

    @kokaneepowerforms

    Thank you for updating us. We are glad that Abajan's suggestion worked on your requirements.

    And I can see what you meant in your nice suggestion.

    Details:

    There is no "Field Details" property group for Header, Image, Html field types in the JotForm builder.

    Similar to this other fields like text fields (screen below)

    Let me submit a ticket to our Next Level support for a request feature for this.

    Thanks.

  • Profile Image

    Answered by kokaneepowerforms on May 28, 2012 at 09:31 PM

    Tks Jonathan - Didn't know it was available on the Text fields so that is good and would love ot see it on the other widgets.

  • Profile Image
    JotForm Support

    Answered by abajan on May 29, 2012 at 07:07 AM

    Hi again kokaneepowerforms

    Your suggestion is duly noted. Incidentally, there are tools that simplify finding the IDs (and classes) of various elements. One of the best is Firebug but your browsers may already have webdev (web development) tools of their own pre-installed.

  • Profile Image

    Answered by kokaneepowerforms on December 09, 2012 at 12:13 PM

    Hey Guys - I am back again with some more form work and I see field details have not been added to the headinds wodget.  I  hate bouncing out to other tools to find this information when it seems like such a simple add to the tools.  Can you twist a developers arm nicely to get this fixed?

     

    Thanks.

  • Profile Image
    JotForm Support

    Answered by abajan on December 09, 2012 at 12:53 PM

    @kokaneepowerforms

    Although adding field details to the aforementioned elements may seem simple to us, I suspect it's not as uncomplicated a task as we think and that's why such information isn't available for the said elements. Nevertheless, I'll submit a ticket.