Contact Form 7 fields in Wordpress Posts/Pages

Question

How can I use Contact Form 7 form tags or shortcodes in WordPress Posts and Pages. Any ideas would be appreciated.

Thanks in advance!

Answer 1

I believe you're looking for "how to add new fields and on submit button in contact form 7. " The syntax for the form is like something below.

Here's a demo working code for you.

<div class="row clearfix">
  <div class="form-group col-md-4 col-sm-6 col-xs-12">
     <div class="form-group-inner">
        <div class="icon-box">
           <label for="your-name">
             <span class="icon flaticon-user168"></span>
           </label>
        </div>
        <div class="field-outer">
          [text* your-name name:username id:your-name placeholder "Your Name"]
        </div>
    </div>
  </div>
  <div class="form-group col-md-4 col-sm-6 col-xs-12">
     <div class="form-group-inner"><div class="icon-box">
      <label for="your-email">
       <span class="icon flaticon-new100"></span>
      </label>
     </div>
     <div class="field-outer">
      [email* name:email id:your-email placeholder "Email"]
     </div>
  </div>
 </div>
 <div class="form-group col-md-4 col-sm-12 col-xs-12">
   <div class="form-group-inner">
     <div class="icon-box">
       <label for="your-subject">
         <span class="icon flaticon-edition2"></span>
       </label>
     </div>
     <div class="field-outer">
       [text* name:subject id:your-subject placeholder "Subject"]
     </div>
    </div>
   </div>
   <div class="form-group col-md-12 col-sm-12 col-xs-12">
    <div class="form-group-inner">
      [textarea name:message placeholder "Your Message"]
    </div>
   </div>
   <div class="form-group col-md-12 col-sm-12 col-xs-12 text-right">
    [submit class:input-submit class:hvr-bounce-to-right name:submit-form "Send Message"]</div>
  </div>

Paste the above code into your new contact form and it should create a new form with name, subject, email and message fields. You can call this form by using shortcode either in page or in your ".php" file. I used this in a php file like below:

<?php echo do_shortcode( "[contact-form-7 id='184' title='Contact form 1']", $ignore_html = false ); ?>

You can also post the shortcode from the contact form 7 into the page directly. Here is a small tutorial for you.