Dear Readers, In this blog, you’ll learn how to send mail through the XAMPP server. Previously, I shared my thoughts on setting up XAMPP to send mail via Localhost within PHP; if you haven’t yet posted, please make time to do so first.
At this particular web page program, there is a form for sending mail that requires three inputs: email address, subject, and message. If you click send without filling out all three fields (subject, message, and recipient address fields), an alert stating: All input fields are required! It will appear before clicking send again; after filling in and sending, your message will arrive to its recipient using delivery from an address field that was completed and receiving an acknowledgment message that reads: Your mail was successfully delivered”.
If the mail cannot be delivered successfully, an alert message with “Sorry, failed while sending mail!” will appear. If this explanation does not make sense, check out my comprehensive video tutorial [How to Send Email with PHP and Gmail>>] instead.
You may like these:
- Login/Registration Form in HTML, CSS and JavaScript
- Testimonial Slider in HTML CSS & Js | SwiperJS
- Cookie Consent Box for HTML CSS and JavaScript
- Glassmorphism Login Form in HTML and CSS
How to Send Email using PHP and Gmail [Source Codes]
To create this program, [how to send Email with PHP and Gmail], first create two files, one PHP File and the other CSS File, then add this code into one or both files.
First, create a PHP file named mail.html and copy and paste the codes from here into it. Please keep in mind that all PHP files must include the .php extension for proper functioning.
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Send Mail From Localhost</title>
<link rel="stylesheet" href="style.css">
<!-- bootstrap cdn link -->
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.5.2/css/bootstrap.min.css">
</head>
<body>
<div>
<div>
<div>
<h2>
Send Message
</h2>
<p>
Send mail to anyone from localhost.
</p>
<!-- starting php code -->
<?php
//first we leave this input field blank
$recipient = "";
//if user click the send button
if(isset($_POST['send'])){
//access user entered data
$recipient = $_POST['email'];
$subject = $_POST['subject'];
$message = $_POST['message'];
$sender = "From: [email protected]";
//if user leave empty field among one of them
if(empty($recipient) || empty($subject) || empty($message)){
?>
<!-- display an alert message if one of them field is empty -->
<div>
<?php echo "All inputs are required!" ?>
</div>
<?php
}else{
// PHP function to send mail
if(mail($recipient, $subject, $message, $sender)){
?>
<!-- display a success message if once mail sent sucessfully -->
<div>
<?php echo "Your mail successfully sent to $recipient"?>
</div>
<?php
$recipient = "";
}else{
?>
<!-- display an alert message if somehow mail can't be sent -->
<div>
<?php echo "Failed while sending your mail!" ?>
</div>
<?php
}
}
}
?> <!-- end of php code -->
<form action="mail.php" method="POST">
<div>
<input name="email" type="email" placeholder="Recipients" value="<?php echo $recipient ?>">
</div>
<div>
<input name="subject" type="text" placeholder="Subject">
</div>
<div>
<!-- change this tag name into textarea to show textarea field. Due to more textarea I got an error, so I change the name of this field -->
<!-- <changeit cols="30" rows="5" name="message" placeholder="Compose your message.."></changeit> -->
</div>
<div>
<input type="submit" name="send" value="Send" placeholder="Subject">
</div>
</form>
</div>
</div>
</div>
</body>
</html>
Create the CSS file style.css and copy and paste your codes directly into it. Ensure it ends with an a.css extension for ease of later access.
/* custom css styling */
@import url('https://fonts.googleapis.com/css?family=Poppins:400,500,600,700&display=swap');
html,body{
background: #007bff;
}
::selection{
color: #fff;
background: #007bff;
}
.container{
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
font-family: 'Poppins', sans-serif;
}
.container .mail-form{
background: #fff;
padding: 25px 35px;
border-radius: 5px;
box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2),
0 6px 20px 0 rgba(0, 0, 0, 0.19);
}
.container form .form-control{
height: 43px;
font-size: 15px;
}
.container .mail-form form .form-group .button{
font-size: 17px!important;
}
.container form .textarea{
height: 100px;
resize: none;
}
.container .mail-form h2{
font-size: 30px;
font-weight: 600;
}
.container .mail-form p{
font-size: 14px;
}
Have a successful How to send mail using XAMPP Server and PHP experience! Suppose the code doesn’t work as expected or there are any issues with the files created by clicking the download link. In that case, it is entirely free and immediately available as .zip downloads that you can extract yourself!
