Make a Contact form like the live demo

I won’t go into a lot of detail here because even though I used the Contact Form 7 plugin for the online demo, you may have a different plugin that you use. However, in reference to the theme’s demo site, I will make this very easy by giving you the code I used for the form I made:

<div id="contact-form">
<p>[text* name class:form-control placeholder "Name"]</p> <p>[email* email class:form-control placeholder "Email"]</p> <p>[text* subject class:form-control placeholder "Subject"]</p> <p>[textarea* comments x5 class:form-control placeholder "Your Comments"]</p> <p>[submit class:small class:button btn "Submit"]</p>
</div>

If you make your own form(s), you can apply the custom style classes like I have in the form code above for your own form, although that is optional. 

  • For all input types, excerpt the submit button, add the class form-control
  • For the submit button, add the class button and also btn like this: button btn

NOTE If you need more information about adding radio buttons, checkboxes, select lists, etc., you can submit your questions to the support forum. I will be adding custom form tutorials soon.