JotForm User Guide / Getting Started with JotForm /

How to Create Your First Web Form

How to Create Your First Web Form

First-time JotForm users often ask how to create a simple web form, how to set up Email Notifications, how to embed a form on a website, how to test the form to see if it's working, and how to view responses in email and JotForm Inbox. Got a tight schedule? Learn it all in two minutes with the video below.

How to create a web form

  1. 1. Decide what to ask
  2. 2. State the purpose in the heading
  3. 3. Use predefined form fields
  4. 4. Use a Long Text Entry field for long answers
  5. 5. Setting up Email Notifications With Email Notifications
  6. 6. Embed your form on a website

1. Decide what to ask

First of all, think about what kind of questions you want to ask our visitors. The best web forms have higher conversion rates by keeping it short and simple. Many users will simply abandon a form if it has too many questions. So keep your web forms as short and clear as possible.

2. State the purpose in the heading

You know why you're creating this web form, but visitors who land on your web page won't know what your form does unless you tell them. Include a short heading, such as "Contact Us," on your form. Put additional info in the subheading if necessary.

3. Use predefined form fields (e.g., Full Name, Email, Address, etc.)

Ask the visitor for their name and email address so you can keep track of your form submissions and follow up with visitors. Click ADD FORM ELEMENT on the left of the Form Builder. All of the standard Form Fields appear under the BASIC tab.

4. Use a Long Text Entry field for long answers (comments, descriptions, etc.)

A large comment box allows visitors to provide longer responses. Use the Long Text Entry field (text area) under the QUICK ELEMENTS section of the BASIC tab.

5. Setting up Email Notifications

With Email Notifications, you’ll receive an alert in your email every time someone completes your form. Click SETTINGS at the top, EMAILS on the left, and the PLUS (+) icon to add a new Email Notification.

Since you're creating an email that will come to you, select NOTIFICATION EMAIL. The AUTORESPONDER is used when you need to send a confirmation email to the user who submitted the form.

For a more in-depth discussion on Email Notifications, refer to our guide on Setting-Up-Email-Notifications.

6. Embed your form on a website

Embedding your form on a website is crucial to continuously collect data. To get your embed codes, click PUBLISH at the top, then EMBED in the left navigation. Choose a different embed option depending on what suits you best.

There are also specific ways of embedding the form on several website builders and CMS platforms. If you're using one, go to the PLATFORMS menu instead and pick the one you're using.

Copy and paste the codes into your website's source code, usually within the body tag, and your form will be integrated the moment you save the changes in your editor.

If you're not sure which one to choose, read our guide on Which-Form-Embed-Code-Should-I-Use?

7. Test your web form to see if it's working

Test your form on your live website to see that notifications are going to your email and your JotForm Inbox. If nothing comes through, go back and check that you set up your form and notification email correctly.

Congratulations on setting up your first web form! Return to this article anytime if you get lost. Tell us about your experience in creating your first web form in the comments section below!

Contact Support:
Our customer support team is available 24/7 and our average response time is between one to two hours.
Our team can be contacted via:
Contact JotForm Support:

Send Comment


See all comments
  • emmanuelkamwagha649

    That's what I want

  • laura.sola

    Hi, I just was testing and it seems that the JotForm account must be opened to have access to the embed form on a website? When I was logged, everything worked. But I left the session of JotForm and the form asked in the website for the login and password of JotForm.
    I'm doing something wrong for sure..

  • evansomoke10

    im about to get the information

  • nlla31415

    I don't understand. I do not have a website. I just want to send the survey to my group. How can I do it and get their response?

  • trodgers068

    Thank you for this informative information about the utilization of your product. I have maybe not an uncommon question for your support team that I will submit after this comment, just wanted to say thank you to Chrisalet Vassell Inspiring Greatness for the gift and you and your team for the platform. Looking foward to the user experience. Happy new year everyone many blessings in all that we do.

  • printerofflinehelpus

    Thank you for your info! just made a form on with the help of this info. Thanx

  • per.johansson196712

    Thanks for your info! Just made our forms complete and published it at SWEDISHPRODUCTS.ONLINE - best Snus and nicotine pouches Shop Online!

  • Richard Armogenia

    Completed my form. During my testing, it is not prompting me to "submit" the form once completed. Did I omit to do anything?

    Appreciate your help!

  • DungSherlock

    i want to receive promotional information "jotform gold" in 2020

  • cillentalbert

    I want to create a web form please tell me how much does it cost

  • cillentalbert

    Can you create a form?

  • jitendraakk

    If am using form 7 in my website. Can I change this form 7 by jotform. What is the process to do it.
    Thank you
    CCNA training in Delhi

  • 2saimcs

    how can we make it more beautiful like we do by using CSS and bootstrap? But in the case of WordPress how can we add different colors and heading colors etc..

  • bicardo

    When you have multiple fields for the same First Names, how can you link all to one field?

  • jmackcounseling

    Hi -- I think there's an option to send you guys my current forms and have you put them into your format, correct?

    If so, how much does that cost?


    Jonathan Mack

  • lhao

    Can we change the font color in "basic" field sections?

  • Bilal

    How much does it cost

  • Sudip Samaddar

    Thanks. I have two questions.

    1. If i change the email password will it stop sending new leads to my email id.

    2. When it sends the leads to my email, will it also send me the url signifying from which the lead landed. This helps in talking to the leads.

  • Greg

    How do I display an element in the form based on previous element form selection(dropdown or multiple choice)

  • PatsySanders

    How do I make a form field required?

  • AndyCarrillo

    how do i add a box with information only

  • Durbin_Donna

    Hello, I have embedded a fillable PDF form using the iframe code for an online course. I want the customer to be able to fill out the form and preview the completed form. How can I make the completed form visible?
    Thank you,

  • wiegeringsurgery

    How do I print the forms to place them online according to my medical practice?

  • jlspitzley

    What my form looks like in the builder is always different (and more messy) in the preview page. Why is it changing how my form looks?

  • icricr

    how do I save an unfinished form that I am working on

  • Claudia

    Can you create a form, like with RSVP for only lets say 80 people?

  • Syed Rohit Deep

    I want to add a form filling for my website visitors.

  • usama haruna gurel


  • Maribel Biton

    This the reality of an imagination, it is a need it is a great help!

  • Pam Wilder

    If you send a form & people are ordering items do they pay with their credit card?

  • whitegatepomsky

    I created a form and can pull it up, but there is no longer an option to edit it, or publish it. It's only appearing as a form for me to fill out as if I am the customer. How do I get this form to show up under "My forms" again?

  • Theresa Lopez

    I want to send the form via WhatsApp to a recipient to complete. LInk does not seem to work.

  • D a

    How to make a form with images

    Then text box

    Then text box

    Then test box

  • jstaylorart

    ADDING PAYMENTS need how to instructions!

  • afaijas

    Thanks for sharing this guide, it is very useful! for my travels web

  • Nick

    Great service, I use to create forms of varying complexity. Before that I used CF7 and then stepFORM.

  • miranda123

    Is there a way to change the font size to control how many pages we print? Also how do I insert page breaks for the printed copy?

  • adil468d

    How to Add time and Email?

  • BluePearlsEnrichmentFoundationI

    Hi, I see the Next button for my form but not the Back button. I checked the visibility for the both and they both say visible for all pages where the buttons reside; the exception is the first page that does not have a Back button.

    What do I need to do to make the Back button visible on the form?

  • BluePearlsEnrichmentFoundationI

    Thank you for responding. This document was very helpful, however, I do not have the elements listed on the pdf editor. Am I doing something wrong? Should I create the application as a form and convert it somehow to a writable pdf? I am confused at this point of what and how to create our scholarship application. Help!


  • RU98Grad

    How do I add photos?

  • Demi

    Hello I am looking to have users make customizable pdfs that I can sell as a digital download directly from my Wordpress site. Is this possible using Jotform? If so, what are the steps?

  • thuylinhphan1604

    I followed the steps above and completed, thanks!

    basketball games

  • Caahil

    Very informative and nicely explained. saves up time.

    Thanks for sharing

  • cathylund

    How do I find directions about the fillable pdf? I'm looking all over your site….

  • katrinacubbins

    I have created and it says that it was saved, but when I copy the link, it brings up the template without the changes??? What am I doing wrong?

  • louisjohna

    I followed the steps correctly! thank you

  • Berenice Larbi

    Hi. Thanks for the video. It's really clear. However I just needed a bit more clarification on what happens to the data when it is returned. I understand it goes to your jot form inbox, but can it be downloaded for eg to a CSV file?

  • morphtvteam

    Thank you very much for the nice share about Creating a web form which is pretty useful, I will also try to create one and put it on my website based on beetv movie app

  • Mike

    Excellent article, it turns out to create a form now is really very simple. I used to use Contact Form 7 for Wordpress, after I tried the uCalc plugin, but now I decided to try something else and JotForm really liked its simplicity.