Once installed and imported demo data, you can manage it in the Dashboard >> Contact >> click Add New to create new contact forms for different parts of your website or edit the existing ones via the Edit option in Contact Forms tab.

contact

How To Setup Contact Forms:

1. Form: 

You can put any content of contact form and click button “Save” then a shortcode will be auto created. Just copy this shortcode into post, page, or text widget content that you want.

contact-form

Demo Mag Paper theme has 3 styles contact form available for Contact Page, just click Edit option in Contact Forms tab then copy and paste below content into contact form:

Contact form 1:

<div class=”contact-form-1″><div class=”contact-form-1″><div class=”row”> <div class=”col-sm-4″>[text* your-name id:contact-name class:contact-name placeholder “Name*”]</div> <div class=”col-sm-4″>[email* your-email id:contact-email class:contact-email placeholder “Email*”]</div><div class=”col-sm-4″>[number* your-phonenumber id:contact-phonenumber class:contact-phonenumber placeholder “Phone Number*”]</div></div>
<div class=”row”> <div class=”col-sm-12″>[text* your-subject id:contact-subject class:contact-subject placeholder “Subject*”]</div></div>
<div class=”row”> <div class=”col-sm-12″>[textarea* your-message id:contact-message class:contact-message placeholder “Message*”]</div></div><div class=”sb-contact”>[submit “SUBMIT”]</div></div>

Contact Form 2:

<div class=”contact-form-2″><div class=”contact-form-2″><div class=”row”> <div class=”col-sm-6″>[text* your-name id:contact-name class:contact-name placeholder “Name*”]</div> <div class=”col-sm-6″>[email* your-email id:contact-email class:contact-email placeholder “Email*”]</div></div><div class=”row”><div class=”col-sm-6″>[number* your-phonenumber id:contact-phonenumber class:contact-phonenumber placeholder “Phone Number*”]</div><div class=”col-sm-6″>[text your-website id:your-website class:your-website placeholder “Website”]</div></div>

<div class=”row”> <div class=”col-sm-12″>[text your-subject id:contact-subject class:contact-subject placeholder “Subject”]</div></div>
<div class=”row”> <div class=”col-sm-12″>[textarea your-message id:contact-message class:contact-message placeholder “Message”]</div></div><div class=”sb-contact”><button type=”submit” class=”wpcf7-submit”>SUBMIT</button></div></div>

Contact Form 3:

<div class=”contact-page”><div class=”contact-page”><div class=”row”> <div class=”col-sm-4″>[text* contact-name id:contact-name class:contact-name placeholder “Name*”]</div> <div class=”col-sm-4″>[email* contact-email id:contact-name class:contact-name placeholder “Email*”]</div><div class=”col-sm-4″>[number* contact-phonenumber id:contact-phonenumber class:contact-phonenumber placeholder “Phone Number*”]</div></div>
<div class=”row”> <div class=”col-sm-12″>[text* contact-subject id:contact-subject class:contact-subject placeholder “Subject*”]</div></div>
<div class=”row”> <div class=”col-sm-12″>[textarea* contact-message id:contact-message class:contact-message placeholder “Message*”]</div></div><div class=”sb-contact”>[submit “SUBMIT”]</div></div>

2. Email:

The most important settings you need to define are located in the Mail tab. To learn more about setting email, you can refer document of contact form plugin. Notes that click “Save” after setting.

email-contact