How to Connect HTML Form to Email Using cPanel SMTP (PHP & PHPMailer)

If you have created a website using HTML, CSS, and JavaScript, you may want to receive visitor enquiries directly in your email inbox.

However, an HTML form alone cannot send emails through an authenticated SMTP server. You need a backend such as PHP to process form submissions and send emails.

In this tutorial, we’ll learn how to connect an HTML form to email using cPanel SMTP, PHP, and PHPMailer. We’ll create an enquiry form, configure a cPanel email account, connect SMTP credentials, and test email delivery.

Technologies Required

• HTML, CSS and JavaScript
• PHP
• cPanel hosting
• PHPMailer
• SMTP email account

How Does It Work?

The process is simple:

01

Fill Out the Form

Visitor enters their details and submits the HTML enquiry form.

02

JavaScript Sends Data

JavaScript securely sends the submitted form data to the PHP backend.

03

PHP Validates Data

PHP checks the submitted information to ensure the data is valid.

04

SMTP Connection

PHPMailer connects to your configured SMTP server using your credentials.

05

Email Delivered!

Your enquiry email is delivered to your configured inbox successfully.

Step 1: Create an HTML Enquiry Form

First, create an index.html file and add a form with the required fields.

<form id="enquiryForm" action="enquiry.php" method="POST">

    <input type="text" name="name"
           placeholder="Full Name" required>

    <input type="email" name="email"
           placeholder="Email Address" required>

    <input type="tel" name="phone"
           placeholder="Phone Number">

    <input type="text" name="subject"
           placeholder="Subject" required>

    <textarea name="message"
              placeholder="Your Message"
              required></textarea>

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

</form>

<div id="formMessage"></div>

You can style the form using CSS according to your website design.

Step 2: Create an Email Account in cPanel

You need a professional email account to receive enquiries.

For example: info@yourdomain.com

Follow these steps:

1. Log in to cPanel.
2. Open Email Accounts.
3. Click Create.
4. Enter your email username.
5. Set a strong password.
6. Create the email account.

Your mailbox is now ready.

Step 3: Get SMTP Configuration Details

Open Email Accounts → Connect Devices or Configure Mail Client.

Find the outgoing mail server details.

Typical SMTP settings:

Setting	Example
SMTP Host	mail.yourdomain.com
Username	info@yourdomain.com
Password	Mailbox password
SSL Port	465
TLS Port	587
Encryption	SSL / TLS

Note: Always use the exact SMTP hostname provided by your hosting company. It may be different from your website domain.

Step 4: Download and Add PHPMailer

PHPMailer is a free, open-source PHP library that allows websites to send emails using SMTP.

Download it from the official repository:

https://github.com/PHPMailer/PHPMailer

For this tutorial, we use PHPMailer 7.1.1 without Composer.

Extract the library and upload the required files into:

vendor/phpmailer/

Make sure the src folder contains the required PHPMailer files, including PHPMailer.php, SMTP.php, and Exception.php.

Step 5: Create config.php

Create a file named config.php to store your SMTP credentials.

<?php

if (basename($_SERVER['SCRIPT_FILENAME']) === 'config.php') {
    http_response_code(403);
    exit('Access denied');
}

return [
    'host' => 'mail.yourdomain.com',
    'username' => 'info@yourdomain.com',
    'password' => 'YOUR_EMAIL_PASSWORD',

    'port' => 465,
    'encryption' => 'ssl',

    'from' => 'info@yourdomain.com',
    'to' => 'info@yourdomain.com',

    'debug' => false
];

Replace the example values with your actual cPanel email details.

If SSL port 465 does not work, try:

'port' => 587,
'encryption' => 'tls',

Keep your SMTP credentials private. Never expose this file in frontend JavaScript or public repositories.

Step 6: Create the PHP Email Backend

Create enquiry.php. This file handles form submissions and sends emails using PHPMailer.

Your backend should:

1. Load config.php.
2. Include PHPMailer files.
3. Accept POST requests only.
4. Validate and sanitize form inputs.
5. Configure SMTP authentication.
6. Create and send the enquiry email.
7. Return a JSON success or error response.

The main SMTP configuration looks like this:

$mail->isSMTP();
$mail->Host = $config['host'];
$mail->SMTPAuth = true;
$mail->Username = $config['username'];
$mail->Password = $config['password'];
$mail->SMTPSecure = $config['encryption'];
$mail->Port = $config['port'];

Set the sender and recipient:

$mail->setFrom($config['from'], 'Website Enquiry');

$mail->addAddress($config['to']);

$mail->addReplyTo($visitorEmail, $visitorName);

Using addReplyTo() ensures that you can reply directly to the visitor who submitted the form.

Remember to handle sending errors securely and never display SMTP credentials or detailed server errors to visitors.

Step 7: Connect the Form Using JavaScript

Use the Fetch API to submit the form without refreshing the page.

Create assets/js/main.js:

const form = document.getElementById("enquiryForm");

if (form) {
    form.addEventListener("submit", async function(e) {
        e.preventDefault();

        const message = document.getElementById("formMessage");

        try {
            const response = await fetch("enquiry.php", {
                method: "POST",
                body: new FormData(form)
            });

            const result = await response.json();

            if (!response.ok || !result.success) {
                throw new Error(result.message || "Submission failed.");
            }

            message.textContent = "Enquiry received successfully!";
            form.reset();

        } catch (error) {
            message.textContent = error.message;
        }
    });
}

Include the JavaScript file in your HTML:

<script src="assets/js/main.js"></script>

Your PHP backend must return JSON responses containing a success property for this script to work.

Step 8: Upload Website Files to cPanel

Open cPanel → File Manager → public_html.

Upload your project while maintaining this folder structure:

public_html/
│
├── index.html
├── config.php
├── enquiry.php
│
├── assets/
│   ├── css/style.css
│   └── js/main.js
│
└── vendor/
    └── phpmailer/
        └── src/
            ├── PHPMailer.php
            ├── SMTP.php
            └── Exception.php

Upload all required PHPMailer files, not just the three shown in this abbreviated structure.

For better security, keep config.php outside the public web directory whenever possible and update its PHP include path accordingly.

Step 9: Test Your Enquiry Form

Open your website and submit a test enquiry.

1. Enter your name and email.
2. Fill in the enquiry details.
3. Click Submit.
4. Check whether the success message appears.
5. Open your cPanel email inbox.
6. Check the Inbox and Spam folders.

Try replying to the received email to verify that the visitor’s address is configured correctly.

Step 10: Improve Email Deliverability

If your emails are going to Spam, configure SPF and DKIM.

1. Open cPanel.
2. Navigate to Email Deliverability.
3. Select your domain.
4. Check SPF and DKIM status.
5. Add the suggested DNS records if required.

These authentication records help Gmail, Outlook, and other email providers verify your outgoing messages.

Common SMTP Errors and Solutions

Error	Solution
Email service is not configured	Check SMTP password and config.php
PHPMailer not available	Verify vendor folder and file paths
SMTP connection failed	Check hostname, port and encryption
Authentication failed	Verify full email username and password
Email goes to Spam	Configure SPF and DKIM
Form shows JSON error	Check PHP errors and server response

For troubleshooting, temporarily enable SMTP debugging in your configuration:

'debug' => true

Check the PHP error log in cPanel under Metrics → Errors. Disable debugging after testing.

Security Best Practices

• Never expose SMTP credentials in HTML or JavaScript.
• Use HTTPS on your website.
• Validate all form inputs on the server.
• Protect your configuration file.
• Add a hidden honeypot field to reduce spam.
• Consider CAPTCHA and rate limiting.
• Never allow visitors to control the recipient email address.
• Keep PHPMailer updated.
• Disable debugging after testing.

Conclusion

Connecting an HTML form to email using cPanel SMTP, PHP, and PHPMailer is a practical way to make your static website functional.

You can use this method for business websites, portfolio websites, landing pages, contact forms, and product enquiry pages.

Quick Recap:

1. Create an HTML enquiry form.
2. Create an email account in cPanel.
3. Get SMTP configuration details.
4. Download and upload PHPMailer.
5. Create config.php with email credentials.
6. Create the PHP backend.
7. Connect JavaScript using Fetch API.
8. Upload files and test email delivery.

With this setup, your website can receive visitor enquiries directly in your professional email inbox without requiring WordPress or third-party form services.

Frequently Asked Questions

1. Can HTML send emails without PHP?

No. HTML cannot independently send emails through authenticated SMTP. You need a backend such as PHP.

2. Is PHPMailer free?

Yes. PHPMailer is an open-source PHP email library.

3. Which SMTP port should I use?

Port 465 is commonly used with SSL, while port 587 is commonly used with TLS. Follow your hosting provider’s settings.

4. Can I use this method on shared hosting?

Yes, provided your hosting supports PHP and allows outgoing SMTP connections.

5. Do I need WordPress for this setup?

No. This method works with standalone HTML websites hosted on cPanel.

6. Why are emails going to Spam?

Check your SPF and DKIM records, sender configuration, and domain reputation.