/**Display Form using short-code**/
[subscription_form]
/**Custom Subscribe Form Style Start**/
#subscribe-form {
display: flex;
gap: 10px;
}
#subscribe-form input[type="email"] {
width: 100%;
height: 40px;
padding: 12px;
border: 1px solid #ccc;
border-radius: 3px;
font-size: 16px;
flex: 1;
}
#subscribe-form input:focus,input:hover{
border-color: #3498db;
}
#subscribe-form button {
line-height: 1rem;
padding: 10px 20px;
border: none;
background-color: black;
color: white;
font-size: 1rem;
border-radius: 3px;
cursor: pointer;
transition: background-color 0.3s;
}
#subscribe-form button:hover {
background-color: #333;
}
#form-message {
margin-top: 10px;
font-size: 16px;
}
#form-message.success {
color: green;
}
#form-message.error {
color: red;
}
@media only screen and (max-width: 600px){
#subscribe-form {
flex-wrap: wrap;
}
#subscribe-form input[type="email"] {
width: 100%;
}
#subscribe-form button {
width: 100%;
}
}
/**Custom Subscribe Form Style End**/
/** Form PHP start**/
//**this snippet will going to register user as wordpress subscriber on form submit.
/*you can use any snippet plugin or directly add this snippet into your theme function.php file*/
<?php
function subscription_form_handler() {
$output = '';
// Check if the form is submitted
if ($_SERVER['REQUEST_METHOD'] == 'POST' && isset($_POST['subscribe'])) {
if (isset($_POST['email']) && is_email($_POST['email'])) {
$email = sanitize_email($_POST['email']);
if (email_exists($email)) {
$message = 'already_registered';
} else {
$username = sanitize_user(explode('@', $email)[0] . '_' . wp_generate_password(4, false));
$password = wp_generate_password();
$user_id = wp_create_user($username, $password, $email);
if (is_wp_error($user_id)) {
$message = 'subscription_failed';
} else {
$user = new WP_User($user_id);
$user->set_role('subscriber');
$message = 'subscription_successful';
}
}
} else {
$message = 'invalid_email';
}
// Redirect to the same page with the message parameter
wp_redirect(add_query_arg('message', $message, get_permalink()));
exit;
}
// Always display the form
$output .= '
<form id="subscribe-form" method="post">
<input type="email" name="email" placeholder="E-Mail" required>
<button type="submit" name="subscribe">Subscribe</button>
</form>';
// Display the message if it exists in the URL parameters
if (isset($_GET['message'])) {
switch ($_GET['message']) {
case 'already_registered':
$output .= '<div id="form-message" class="error">Already Registered</div>';
break;
case 'subscription_failed':
$output .= '<div id="form-message" class="error">Subscription failed.</div>';
break;
case 'subscription_successful':
$output .= '<div id="form-message" class="success">Subscription successful!</div>';
break;
case 'invalid_email':
$output .= '<div id="form-message" class="error">Invalid email address.</div>';
break;
}
}
return $output;
}
add_shortcode('subscription_form', 'subscription_form_handler');
function enqueue_custom_script() {
?>
<script type="text/javascript">
document.addEventListener('DOMContentLoaded', function() {
const url = new URL(window.location);
if (url.searchParams.has('message')) {
url.searchParams.delete('message');
window.history.replaceState({}, document.title, url.toString());
}
});
</script>
<?php
}
add_action('wp_footer', 'enqueue_custom_script');
?>
/**Form Php End **/