How to put text as placeholder?

  • emeea
    Asked on April 13, 2016 at 1:11 AM

    Hello,

    I have realised that I would like to design my form as the layout attached. Could you please let me know how to put the text in as placeholder to create an exact copy of this attachment? I want the background colour to fill the whole website page. Is this possible? Thank you so much.How to put text as placeholder? Image 1 Screenshot 20

  • Chriistian Jotform Support
    Replied on April 13, 2016 at 1:29 AM

    You can achieve your requirement by adding the Labelless widget to your form. Here's a demo form so you can see it in action: https://form.jotform.com/61031156087954 

    How to put text as placeholder? Image 1 Screenshot 30

    Then to change the background color of your form:

    1. Click the Preferences button on your form builder.
    2. Select the Form Styles tab and click the field beside the Background section. 
    3. Pick the color you want from the Color Picker and click OK to save.

    How to put text as placeholder? Image 2 Screenshot 41

    You can also change the background color from the Form Designer. Check out this article to learn how: Form Designer Tutorial.

    If you need further assistance, please let us know.
    Regards.

  • emeea
    Replied on April 15, 2016 at 12:41 AM

    Thank you for your prompt reply. Is it possible to design the exact form that I previously sent, ie; choosing font family and size so that it displays smaller in the input box?

    I am also not keen on the way 'name' etc slides over to the right, can it just fade when user puts the cursor in the input box?

    thank u very much

  • Chriistian Jotform Support
    Replied on April 15, 2016 at 1:51 AM

    If you want the name to just fade when a user puts the cursor in the input box, then you can simply replace the Labelless widget with a regular Text-box field. Then add a Hint Example and input the label of the field there.

    How to put text as placeholder? Image 1 Screenshot 40

    To change the Form Font, please follow this guide: How to Change Form Fonts

    To change the Font Size, you can check out this article: How to Change Font Size on Forms

    You can also modify the text-box field to make it look more similar to your example. Simply go to your Form Designer and click the textbox. To open the Form Designer, please follow this guide: Form Designer Tutorial: Let's create fantastic forms!

    How to put text as placeholder? Image 2 Screenshot 51

    You can check out this demo form to see it in action: https://form.jotform.com/61051127660951 
    If you like, you can also clone this demo to your account. How to Clone an Existing Form from a URL

    How to put text as placeholder? Image 3 Screenshot 62

    If you need further assistance, please let us know.