How to Create Custom Form in WordPress

How to Create Custom Form In WordPress

Today I’m going to contribute some help to developers who have been struggling like me. I’ve lost my 4 – 5 hours for How to Create Custom Post Form In WordPress. I’m new to WordPress but somehow I am able to complete the task and now I’m here to tell you how to create a custom post form on the front side.

 Let’s Begin First of all we will create a template in our theme.
here I’m using a free theme human, it does not matter whatever theme you can use, we are just creating a template. Open your file editor, and write

   <?php /* Template Name: Custom Post Form */ ?>

and save this file as template-custom-post-form.php inside your selected theme. Note: If you are using a child theme please save this file inside the child theme. We have just created a template, now login to your admin 1. Add new Page 2. Choose a Page template that we have just created from the page template dropdown on the left side. 3. Save Now open this page. you will see a blank page. hurray…. you have successfully created a page template. Now, we will create a Form to post data. This form will not ask for a login to post. if you want, your user should log in to post you can check that by the is_user_loggedin() function. Here I wanted a form that will post articles without login, and after successful submission, I will use the full name, email, and author bio to create a user profile.

is_user_loggedin();

< form method="post" action="<?php echo site_url(); ?>/submit-post" role="form" class="themeform" >

<div class="form-group">
<label for="Full Name">Full Name : </label>
<input type="text" name="fname" placeholder="Full Name" class="form-control" value="<?php if(isset($_POST['fname'])) echo $_POST['fname']; ?>">
<span class="error"><?php if(isset($error['fname'])) echo $error['fname']; ?></span>
</div>

<div class="form-group">
<label for="Email">Email : </label>
<input type="email" name="email" placeholder="example@example.com" class="form-control" value="<?php if(isset($_POST['email'])) echo $_POST['email']; ?>">
<span class="error"><?php if(isset($error['email'])) echo $error['email']; ?></span>
</div>

<div class="form-group">
<label for="Author Bio">Author Bio : </label>
<textarea name="author_bio" placeholder="Professor, Farwest University" class="form-control"><?php if(isset($_POST['author_bio'])) echo $_POST['emauthor_bioail']; ?></textarea>
<span class="error"><?php if(isset($error['author_bio'])) echo $error['author_bio']; ?></span>
</div>

<div class="form-group">
<label for="Post Title">Post Title : </label>
<input type="text" name="post_title" placeholder="Post Title" class="form-control" value="<?php if(isset($_POST['post_title'])) echo $_POST['post_title']; ?>">
<span class="error"><?php if(isset($error['post_title'])) echo $error['post_title']; ?></span>
</div>

<div class="form-group">
<label for="category">Category</label>
<?php wp_dropdown_categories( 'show_option_none=Select Category&tab_index=4&taxonomy=category&class=form-control' ); ?>
<span class="error"><?php if(isset($error['cat'])) echo $error['cat']; ?></span>
</div>

<div class="form-group">
<label for="Post Content">Post Content : </label>
<span class="error"><br/><?php if(isset($error['post_content'])) echo $error['post_content']; ?></span>
<?php 
$content=""; 
$editor_id="post_content"; 
$settings = array('media_buttons'=>false,'wpautop'=>false,'editor_height'=>300,'editor_class'=>'custom_post_form');

wp_editor($content, $editor_id, $settings); 
?>

</div>

<div class="form-group">
<!-- <label for="fname">Full Name : </label> -->
<input type="submit" name="submit" value="submit" class="btn btn-default">
</div>
<?php wp_nonce_field( 'new-post' ); ?>

</ form >

in the above code action is site_url().’/submit-post, you should replace that slug with your page slug. And for the editor, I have used wp_editor(), which allows us to configure it according to our needs. At the last of the form I have added wp_nonce_field(); This is important for security reasons. Now the main part is here Handling Form Submission

/*Handle POst Request*/
$error=array();
$success = false;
if(isset($_POST['submit']) && 'POST' == $_SERVER['REQUEST_METHOD'])
{
 $stat = true;

 if(isset($_POST['fname']) && $_POST['fname']!==""){
  
  $fname= sanitize_text_field($_POST['fname']);
  
 }else{
  
  $error['fname']= 'please enter your full name'; 
  $stat = false; 
 }

 if(isset($_POST['email']) && $_POST['email']!=""){
  $email = sanitize_email($_POST['email']);
  
 }else{
  $error['email'] = "Please enter your valid email";
  $stat = false;
 }

 if(isset($_POST['author_bio']) && $_POST['author_bio']!=""){
  $author = sanitize_textarea_field($_POST['author_bio']);
  
 }else{
  $error['author_bio'] = "Please describe your self";
  $stat = false;
 }

 if(isset($_POST['post_title']) && $_POST['post_title']!=""){
  $post_title = sanitize_text_field($_POST['post_title']);
  
 }else{
  $error['post_title'] = "Please give this post a title";
  $stat = false;
 }

 if(isset($_POST['cat']) && $_POST['cat']!=""){
  $cat = $_POST['cat'];
  
 }else{
  $error['cat']="Please select a post category";
  $stat = false;
 }

 if(isset($_POST['post_content']) && $_POST['post_content']!=""){
  $post_content = $_POST['post_content'];
  
 }else{
  $error['post_content'] = "Please write some words";
  $stat = false;
 }

 
 if($stat == true)
 {
  $exists = email_exists($email);
  if($exists)
  {
   $author_id = $exists;   
  }
  else
  {
   $user_data = array(
   'user_pass' => wp_generate_password(),
   'user_login' => $email,
   'user_nicename' => $fname,
   'user_url' => '',
   'user_email' => $email,
   'display_name' => $fname,
   'nickname' => $fname,
   'first_name' => $fname,  
   'role' => get_option('contributor') // Use default role or another role, e.g. 'editor'
   );
  
   $author_id = wp_insert_user( $user_data ,$Err=true);
   update_user_meta( $author_id, 'description', $author);
  } 

  $post_array = array(
   'post_title' => $post_title,
   'post_content'=> $post_content,
   'post_author' => $author_id,
   'post_status' => 'pending',
   'post_type' => 'post',
   'post_category' => array($cat),
   );
  $post = wp_insert_post($post_array, $Err=true);
  if($post){
   $success=true;
   $url=site_url().'/submit-post?success='.$success;
   wp_redirect($url);
  }

 }   
  
}?>

Here, i have saved user details to create a user profile, but I didn’t send login details to the user. But you can do this if you need it. You should do this before page redirects

If($post){
//Send your parameters
 Wp_mail($to,$header,$subject,$msg);
}

Put Both codes in template-custom-post-form.php and save it. now open the page you have created. you can see the form now. Note: There is no stylesheet for form, you can create yourself. Congrats you have successfully created a custom post form. You can use this code as a shortcode. Create a function in the function.php file of your theme. copy whole code inside the function. and add a hook to create a shortcode.

That’s it.

Enjoy!