Currently Reading

Introducing contact forms for static websites

An email has been time tested means of communication. Any website without a contact form has no way to contact the site owners, which could lead to loss of potential leads.

W3Layouts Forms will help everybody to add a contact form inside their HTML website without a need for a backend server like PHP.

Setting up a new form

Login to your W3Layouts account and Go to Form

Click Add New then enter the Domain Name, and Email ID you want to receive entries. Then click create a contact form.

Email Verification

You will get a verification mail to your email. Click verify now

Domain Verification with Meta tag

hit the verify button next to the domain name

Domain Verification with HTML file

Verify domain name by adding the HTML file to your websites public_html or www or htdocs. Once the verification of both the email and domain are done you can a form inside your website.

Adding form inside a website.

Using W3Layouts forms is very straight forward. You can simply add form action as “https://sendmail.w3layouts.com/SubmitContactForm” and method as “POST” 

<form action="https://sendmail.w3layouts.com/SubmitContactForm" method=“post”>

W3Layouts supports four inputs. Name, Email, Subject, and Message.
Sender Name = w3lName

<input type="text" name=“w3lName" required/>

Sender Email = w3lSender

<input type="email" name=“w3lSender" required/>

Subject = w3lSubject 

<input type="text" name="w3lSubject"/>

Message= w3lMessage 

 <textarea type="text" name=“w3lMessage” required></textarea>

Sender name, email and message are mandatory fields.

A fully working form would something like this

<form action="https://sendmail.w3layouts.com/SubmitContactForm" method=“post">
   <div>
      <label>Name</label>
      <input type="text" name=“w3lName">
    </div>
    <div>
      <label>Email</label>
      <input type="email" name=“w3lSender">
   </div>
   <div>
      <label>Subject</label>
      <input type="text" name=“w3lSubject">
   </div>
   <div>
      <label>Message</label>
      <textarea name=“w3lMessage"></textarea>
   </div>
   <div>
         <input type="submit" >
   </div>
</form>

For more details or help contact our support

Related Posts