Introduction:
OptinMonster is a popular tool for collecting visitors’ emails and growing email lists, especially when visitors try to exit the site. However, if you’re looking for a truly free alternative that doesn’t require third-party tools, PHP provides a perfect solution for building a simple exit-intent email capture popup.
In this article, we will walk you through how to create your own PHP-based exit-intent email capture system. This solution is completely free and can be integrated directly into your website, providing an efficient way to collect emails when visitors attempt to leave your site.
Frontend and Backend PHP Code for Email Collection on Exit Intent
To implement this free alternative to OptinMonster, we will use HTML, JavaScript, and PHP. The JavaScript detects the user’s intention to exit the site, triggering a popup to collect their email address. The PHP backend processes and stores the email.
1. Frontend HTML and JavaScript (index.php)
This code creates an email capture form that appears when the user’s mouse moves toward the top of the browser window, indicating they might be about to leave the website.
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta name="description" content="Best free PHP alternative to OptinMonster for collecting emails using exit intent popups." />
<meta name="keywords" content="Free PHP alternative, OptinMonster, email capture, exit intent popup, PHP email collection" />
<title>Best Free PHP Alternative to OptinMonster</title>
<style>
/* Popup modal style */
.popup-overlay {
display: none;
position: fixed;
top: 0;
left: 0;
width: 100%;
height: 100%;
background: rgba(0, 0, 0, 0.7);
z-index: 9999;
}
.popup-content {
position: fixed;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
background-color: white;
padding: 20px;
width: 300px;
text-align: center;
box-shadow: 0 0 10px rgba(0, 0, 0, 0.5);
}
.popup-content input[type="email"] {
width: 100%;
padding: 10px;
margin-bottom: 10px;
border: 1px solid #ccc;
border-radius: 5px;
}
.popup-content input[type="submit"] {
background-color: #28a745;
color: white;
border: none;
padding: 10px 20px;
cursor: pointer;
}
.popup-close {
cursor: pointer;
font-size: 18px;
color: red;
float: right;
}
</style>
<script>
// Show popup on exit intent
document.addEventListener('mouseout', function (event) {
if (!event.toElement && !event.relatedTarget && event.clientY <= 10) {
document.getElementById('popupOverlay').style.display = 'block';
}
});
// Close popup
function closePopup() {
document.getElementById('popupOverlay').style.display = 'none';
}
</script>
</head>
<body>
<!-- Exit Intent Popup -->
<div id="popupOverlay" class="popup-overlay">
<div class="popup-content">
<span class="popup-close" onclick="closePopup()">×</span>
<h2>Don't leave yet!</h2>
<p>Subscribe to get our latest updates and offers.</p>
<form action="save_email.php" method="POST">
<input type="email" name="email" placeholder="Enter your email" required>
<input type="submit" value="Subscribe">
</form>
</div>
</div>
</body>
</html>
Explanation of the Frontend Code:
- JavaScript Exit Intent Detection: The
mouseoutevent triggers the popup when the mouse moves toward the top of the screen (likely an attempt to leave the page). - Popup Modal: The popup modal is hidden by default (
display: none) and becomes visible when the user’s exit intent is detected. - Close Button: The user can close the popup by clicking the close button (
×), which hides the popup. - Email Form: When the form is submitted, it sends the email address to
save_email.phpfor backend processing.
2. Backend PHP Script (save_email.php)
This backend PHP script processes the email form submission, validates the email address, and stores it in a text file called emails.txt.
<?php
if ($_SERVER["REQUEST_METHOD"] == "POST") {
// Sanitize and validate email input
$email = filter_var($_POST['email'], FILTER_SANITIZE_EMAIL);
if (filter_var($email, FILTER_VALIDATE_EMAIL)) {
// Define the file to store emails
$file = 'emails.txt';
// Add email with timestamp to the file
$currentDate = date("Y-m-d H:i:s");
$entry = $email . " - Subscribed on: " . $currentDate . "\n";
// Append the email to the file
if (file_put_contents($file, $entry, FILE_APPEND | LOCK_EX)) {
echo "Thank you for subscribing!";
} else {
echo "Failed to save your email. Please try again.";
}
} else {
echo "Invalid email address.";
}
} else {
echo "Invalid request.";
}
?>
Explanation of the Backend Code:
- Form Submission Handling: The script checks if the form was submitted using the
POSTmethod. It then sanitizes the email input to prevent harmful data from being saved. - Email Validation: The
filter_var()function is used to validate the email address, ensuring that only valid emails are saved. - File Storage: The validated email is appended to a file called
emails.txtwith a timestamp. This file will store all the collected emails. - Error Handling: If the email is invalid or the file write operation fails, the script outputs an error message.
Conclusion:
If you’re looking for a free and easy way to collect visitors’ emails using an exit intent popup, this PHP-based solution is a fantastic alternative to OptinMonster. With just a few lines of JavaScript, HTML, and PHP, you can create a fully functional system to capture leads when visitors are about to leave your website.
By implementing this solution, you’ll not only save money but also have full control over how and where you store your subscribers’ emails. Whether you’re a small business, blogger, or just starting out, this truly free alternative to OptinMonster is perfect for growing your email list without the need for expensive tools.
How to Use:
- Frontend (index.php): Add the HTML, CSS, and JavaScript code to your webpage to trigger the exit-intent popup.
- Backend (save_email.php): Use the PHP script to handle the form submissions and store the emails in a text file.
- Email List: Emails are saved in
emails.txt, which you can use later for your email marketing campaigns.
By following this tutorial, you’ll have a completely free alternative to OptinMonster that helps you capture leads when visitors attempt to leave your site, making it easier to grow your email list and engage with your audience.
Get epic product battles straight to you! 🥊 📦 