Contact Forms

To create/edit Contacts Form, please do the following:

  1. Go to Dashboard > Contact > Contact Forms > Add New / Edit.

  2. Enter form name, for example "Contact Form"

  3. In the tab "Form" you can use default form layout or enter this code lines:

    <div class="row clearfix justify-content-center">
     <div class="col-md-4">
      <div class="form-group">
       <label for="cf_name"><i class="far fa-user"></i></label>
       [text* cf_name id:cf_name class:form-control placeholder "Full Name"]
      </div>
     </div>
     <div class="col-md-4">
      <div class="form-group">
       <label for="cf_email"><i class="far fa-envelope"></i></label>
       [email* cf_email id:cf_email class:form-control placeholder "Email Address"]
      </div>
     </div>
     <div class="col-md-4">
      <div class="form-group">
       <label for="cf_phone"><i class="fas fa-phone"></i></label>
       [tel* cf_phone id:cf_phone class:form-control placeholder "Phone Number"]
      </div>
     </div>
     <div class="col-sm-12">
      <div class="form-group">
       [textarea cf_text id:cf_text class:form-control rows:5 placeholder "Enter Message"]
      </div>
     </div>
     <div class="col-lg-5 col-md-6 col-sm-8">
      <div class="form-group mb-0">
       [submit class:theme-btn class:w-100 class:style-six "Send message"]
      </div>
     </div>
    </div>

  4. In the tab "Mail", enter this your email address.

  5. Save Changes.

To insert Contact form to page, please do the following:

  1. Go to Dashboard > Pages > Contacts > Edit Page.

  2. In the tab "Page Attributes" > "Template", select "Layout builder (Elementor)". In the tab "Publish" click to "Publish" button.

  3. Click to "Edit with Elementor" button.

  4. In Elementor builder panel drag and drop "Lesya Theme" widgets for forms.

(Video instructions below):

Lesya - how create/edit Contact Page with CF7 forms & Elementor

Saved your time and you want to thank me? You can image-text 😊

Last updated