Check the first part of this article here.
Continued..
8. Next, we need to show a contact form at the front-end. For this, we shall be following these points :
a. We'll create a shortcode
b. A function (say, 'myplugin_shortcode_handler()') will be assigned to it.
c. We can place or call the shortcode almost anywhere, within pages, posts, header or footer.
d. Whenever Wordpress sees the shortcode, it calls the myplugin_shortcode_handler() function.
So, we are just left with 2 jobs, i) create a shortcode and ii) define corresponding function 'myplugin_shortcode_handler()'. Let's do it one by one.
9. Within the same file xyz.php, we'll add the following line :
add_shortcode( 'myplugin', 'myplugin_shortcode_handler' );
The above line creates a shortcode '[myplugin]', which can be placed on almost all places. And Wordpress will call 'myplugin_shortcode_handler()' function when it encounters the above shortcode.
10. Now, we build the function 'myplugin_shortcode_handler()'. Check the code below :
<?php
function myplugin_shortcode_handler()
{
// Variables
$message = "";
$error = 0;
$myplugin_name = "";
$myplugin_email = "";
// Handle POST
if(isset($_POST['myplugin_btnsubmit']))
{
// GET POST Data
$myplugin_email = trim($_POST['myplugin_email']);
$myplugin_name = trim($_POST['myplugin_name']);
// Validation
if($myplugin_email!="" && $myplugin_name!="")
{
// Email Validation
if( filter_var($myplugin_email, FILTER_VALIDATE_EMAIL) )
{
// Send the contact mail
$recipient_email = get_option('myplugin_recipient_email');
if($recipient_email!="")
{
// SEND MAIL
$subject = "Contact Form";
$message = "Name : $myplugin_name <br>".
"Email : $myplugin_email";
$headers = 'MIME-Version: 1.0' . "\r\n";
$headers .= 'Content-type: text/html;' . "\r\n";
$headers .= 'From: $myplugin_name <$myplugin_email>' . "\r\n";
mail($recipient_email, $subject, $message, $headers);
$message = "Thank you for contacting us";
$error = 0;
}
else
{
$message = "Some error Occurred";
$error = 1;
}
}
else
{
$message = "Invalid Email Address";
$error = 1;
}
}
else
{
$message = "Name and Email can not be blank";
$error = 1;
}
}
// POST Handling part completed
// Now Generate the Contact Form
echo
"<form method='post' action=''>
<div class='myplugin_div'>
<div>
<span>Enter Name </span>
<input type='text' name='myplugin_name' value='".
($error?$myplugin_name:"")."'>
</div>
<div>
<span>Enter Email </span>
<input type='text' name='myplugin_email' value='".
($error?$myplugin_email:"")."'>
</div>
<div>
<input type='submit' value='Submit' name='myplugin_btnsubmit'></div>
</div>
<div class='myplugin_error'>";
// Show Messages if any
echo "<span style='color:" . ($error?'red':'green') . "'>". ($message!=""?$message:"") ;
echo "</span></div></form>";
}
?>
The above form includes the POST handling PHP code. Couple of things need to be said here ...
a. The <input> elements' names should NOT be like 'email', 'name' etc. These names are reserved by Wordpress. So the Form submission can land into 404 error page.
b. Notice, how we have called the get_option() to get the recipient email address where the contact detail will be sent.
Check a screenshot below :
The methods we followed in the example above, could have involved AJAX post method also. How to use Ajax in Wordpress has been discussed in the article Ajax calls in Wordpress - Part I.
Continued..
8. Next, we need to show a contact form at the front-end. For this, we shall be following these points :
a. We'll create a shortcode
b. A function (say, 'myplugin_shortcode_handler()') will be assigned to it.
c. We can place or call the shortcode almost anywhere, within pages, posts, header or footer.
d. Whenever Wordpress sees the shortcode, it calls the myplugin_shortcode_handler() function.
So, we are just left with 2 jobs, i) create a shortcode and ii) define corresponding function 'myplugin_shortcode_handler()'. Let's do it one by one.
9. Within the same file xyz.php, we'll add the following line :
add_shortcode( 'myplugin', 'myplugin_shortcode_handler' );
The above line creates a shortcode '[myplugin]', which can be placed on almost all places. And Wordpress will call 'myplugin_shortcode_handler()' function when it encounters the above shortcode.
10. Now, we build the function 'myplugin_shortcode_handler()'. Check the code below :
<?php
function myplugin_shortcode_handler()
{
// Variables
$message = "";
$error = 0;
$myplugin_name = "";
$myplugin_email = "";
// Handle POST
if(isset($_POST['myplugin_btnsubmit']))
{
// GET POST Data
$myplugin_email = trim($_POST['myplugin_email']);
$myplugin_name = trim($_POST['myplugin_name']);
// Validation
if($myplugin_email!="" && $myplugin_name!="")
{
// Email Validation
if( filter_var($myplugin_email, FILTER_VALIDATE_EMAIL) )
{
// Send the contact mail
$recipient_email = get_option('myplugin_recipient_email');
if($recipient_email!="")
{
// SEND MAIL
$subject = "Contact Form";
$message = "Name : $myplugin_name <br>".
"Email : $myplugin_email";
$headers = 'MIME-Version: 1.0' . "\r\n";
$headers .= 'Content-type: text/html;' . "\r\n";
$headers .= 'From: $myplugin_name <$myplugin_email>' . "\r\n";
mail($recipient_email, $subject, $message, $headers);
$message = "Thank you for contacting us";
$error = 0;
}
else
{
$message = "Some error Occurred";
$error = 1;
}
}
else
{
$message = "Invalid Email Address";
$error = 1;
}
}
else
{
$message = "Name and Email can not be blank";
$error = 1;
}
}
// POST Handling part completed
// Now Generate the Contact Form
echo
"<form method='post' action=''>
<div class='myplugin_div'>
<div>
<span>Enter Name </span>
<input type='text' name='myplugin_name' value='".
($error?$myplugin_name:"")."'>
</div>
<div>
<span>Enter Email </span>
<input type='text' name='myplugin_email' value='".
($error?$myplugin_email:"")."'>
</div>
<div>
<input type='submit' value='Submit' name='myplugin_btnsubmit'></div>
</div>
<div class='myplugin_error'>";
// Show Messages if any
echo "<span style='color:" . ($error?'red':'green') . "'>". ($message!=""?$message:"") ;
echo "</span></div></form>";
}
?>
The above form includes the POST handling PHP code. Couple of things need to be said here ...
a. The <input> elements' names should NOT be like 'email', 'name' etc. These names are reserved by Wordpress. So the Form submission can land into 404 error page.
b. Notice, how we have called the get_option() to get the recipient email address where the contact detail will be sent.
Check a screenshot below :
The methods we followed in the example above, could have involved AJAX post method also. How to use Ajax in Wordpress has been discussed in the article Ajax calls in Wordpress - Part I.
