Free Contact Us Page Generator Without Plugins using HTML

Free Contact Us Page Generator HTML

Want to make a Contact Us Page For your Website, but don’t want to use any plugins like Contact Form 7 Plugin? The use of a maximum number of plugins can lead slow down your website speed. With our hassle-free Free Contact Us Page Generator. No need for complicated plugins or coding skills. Just use our user-friendly HTML template to effortlessly create a professional Contact Us page that invites seamless communication. Engage your audience effortlessly with a page tailored to your brand, enhancing accessibility and interaction. Build trust, inspire inquiries, and foster engagement—all with a few easy steps. Start building your perfect Contact Us page today!

How to make Contact Us Page using HTML?

Step 1: Copy the HTML Code First and Paste to your Contact Us Page in HTML Format

    
      <form action="https://website.com/contact.php" method="post">

  <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>

  <button type="submit">Submit</button>

</form>

<style>
  /* Apply styles to form elements */
  form {
    max-width: 500px;
    margin: auto;
  }
  label {
    display: block;
    margin-bottom: 5px;
    font-weight: bold;
  }
  input[type="text"],
  input[type="email"],
  textarea {
    width: 100%;
    padding: 10px;
    border: 2px solid #ccc;
    border-radius: 4px;
    box-sizing: border-box;
    margin-bottom: 10px;
    font-size: 16px;
    resize: none;
  }
  button[type="submit"] {
    background-color: #4CAF50;
    color: white;
    padding: 12px 20px;
    border: none;
    border-radius: 4px;
    cursor: pointer;
    font-size: 16px;
  }
  button[type="submit"]:hover {
    background-color: #45a049;
  }
</style>
    
  

Step 2: Change the Website Name on HTML Code

    
      <?php
// Get the form data
$name = $_POST['name'];
$email = $_POST['email'];
$message = $_POST['message'];

// Validate the form data
if (empty($name) || empty($email) || empty($message)) {
  // If any required fields are missing, return an error response
  http_response_code(400);
  echo "Please fill out all required fields.";
  exit;
}

// Set the email recipient
$to = "email@gmail.com";

// Set the email subject
$subject = "New contact form submission from $name";

// Set the email message
$message_body = "Name: $name\nEmail: $email\nMessage: $message";

// Set the email headers
$headers = "From: $email\r\nReply-To: $email\r\n";

// Send the email
if (mail($to, $subject, $message_body, $headers)) {
  // If the email was sent successfully, show a success message in a popup window
  echo "<script>alert('Thank you for your message. We will be in touch soon.');</script>";
} else {
  // If the email could not be sent, show an error message in a popup window
  echo "<script>alert('Oops! Something went wrong and we couldn't send your message.');</script>";
}

// Add an automatic redirect to the homepage
echo "<script>window.location.href = '/';</script>";
?>
    
  

Step 3: Copy the HTML Code and paste it on a notepad Change the email address on HTML Code then save it using the name “contact.php”.

Step 4: Upload contact.php on the Public_html folder on your domain, and Done!

Following the simple process you can intricate a beautiful, responsive, and mobile-friendly Contact Us Page for your Website using this Contact Us Page Generator.