Written by: Geoffrey Callaghan

How To Create A Contact Form That Sends An Email

How To Create A Contact Form That Sends An Email

fabform.io is a service that allows you to create HTML forms easily and handle form submissions. To create an HTML form that sends you an email using fabform.io, follow these steps:

  1. Sign Up for fabform.io:

  2. Create a New Form:

    • After signing up, log in to your fabform.io account.
    • Click on the “New Form” button to create a new form.
    • Fill in the necessary details, such as the form name.
  3. Configure Form Settings:

    • Set up form settings, such as the redirect URL after form submission, confirmation message, and email notifications.
  4. Add Form Fields:

    • Add the required form fields (name, email, message, etc.) based on the information you want to collect.
  5. Get Form Endpoint URL:

    • Once you’ve configured your form, you’ll get a unique form endpoint URL. This URL is where your form data will be sent.
  6. Create HTML Form:

    • Create an HTML form on your website or web page. You can use a code editor for this.
    • Use the <form> element to define your form and include input fields for the data you want to collect.
    <!DOCTYPE html>
    <html lang="en">
    <head>
        <meta charset="UTF-8">
        <meta name="viewport" content="width=device-width, initial-scale=1.0">
        <title>Your Form</title>
    </head>
    <body>
    
        <form action="YOUR_FORM_ENDPOINT_URL" method="POST">
            <!-- Input fields -->
            <label for="name">Name:</label>
            <input type="text" id="name" name="name" required>
    
            <label for="email">Email:</label>
            <input type="email" id="email" name="email" required>
    
            <label for="message">Message:</label>
            <textarea id="message" name="message" required></textarea>
    
            <!-- Submit button -->
            <input type="submit" value="Submit">
        </form>
    
    </body>
    </html>

    Replace YOUR_FORM_ENDPOINT_URL with the actual form endpoint URL provided by fabform.io.

  7. Deploy your HTML Form:

    • Upload the HTML file to your web server or deploy it using a platform like GitHub Pages, Netlify, or Vercel.
  8. Test the Form:

    • Visit your web page, fill out the form, and submit it. Check if you receive the form submission confirmation on fabform.io.
  9. Configure Email Notifications:

    • If you haven’t already, configure email notifications on fabform.io to receive form submissions via email.

That’s it! Your HTML form is now connected to fabform.io, and form submissions will be sent to the specified email address.