Contact Page

To create Contacts Form, please do the following:

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

  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">
      <div class="col-xs-12 col-sm-12 col-md-12 col-lg-4">
        <div class="kf-field">
          [text* cf_name placeholder "Full Name"]
          <i class="far fa-user"></i>
        </div>
      </div>
      <div class="col-xs-12 col-sm-12 col-md-12 col-lg-4">
        <div class="kf-field">
          [email* cf_email placeholder "Email"]
          <i class="fas fa-at"></i>
        </div>
      </div>
      <div class="col-xs-12 col-sm-12 col-md-12 col-lg-4">
        <div class="kf-field">
          [tel* cf_phone placeholder "Phone"]
          <i class="fas fa-mobile-alt"></i>
        </div>
      </div>
      <div class="col-xs-12 col-sm-12 col-md-12 col-lg-12">
        <div class="kf-field">
          [text* cf_subject placeholder "Subject"]
        </div>
      </div>
      <div class="col-xs-12 col-sm-12 col-md-12 col-lg-12">
        <div class="kf-field">
          [textarea* cf_message placeholder "Message"]
        </div>
      </div>
      <div class="col-xs-12 col-sm-12 col-md-12 col-lg-12">
        <div class="kf-bts">
          <button type="submit" class="kf-btn">
            <span>Send us message</span>
            <i class="fas fa-chevron-right"></i>
          </button>
        </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 > Add New.

  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 "Kaffen Theme" elements: "Services", "Contact Form" and more.

(Video instructions below):

Kaffen - how create Contact Page with CF7 forms with Elementor

Last updated