> For the complete documentation index, see [llms.txt](https://bslthemes.gitbook.io/kaffen-wp-doc/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://bslthemes.gitbook.io/kaffen-wp-doc/contact-page.md).

# 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):

{% embed url="<https://bslthemes.com/kaffen/kaffen_wp_doc/videos/video10.mp4>" %}
Kaffen - how create Contact Page with CF7 forms with Elementor
{% endembed %}
