> For the complete documentation index, see [llms.txt](https://bslthemes.gitbook.io/orabel-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/orabel-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="orb-grid orb-padding-grid">
   	<div class="orb-g-50 orb-sm-100">
   		<div class="orb-group-input">
   			[text* cf-name placeholder "Name"]
   		</div>
   	</div>
   	<div class="orb-g-50 orb-sm-100">
   		<div class="orb-group-input">
   			[email* cf-email placeholder "E-mail"]
   		</div>
   	</div>
   	<div class="orb-g-100">
   		<div class="orb-group-input">
   			[textarea cf-message placeholder "Your message"]
   		</div>
   	</div>
   </div>
   <div class="orb-form-bottom">
   	<div class="accept-terms-wrap">
   		[checkbox* cf-terms class:inp-cbx "accept"]

   		<label class="cbx terms" for="cbx">
   			<span>
   				<svg width="12px" height="10px" viewbox="0 0 12 10">
   					<polyline points="1.5 6 4.5 9 10.5 1"></polyline>
   				</svg>
   			</span>
   			<span>I accept<a href="/orabel/terms/" data-no-swup class="terms-link" target="_blank">terms</a>.</span>
   		</label>
   	</div>
   	<button class="orb-submit-btn" type="submit">
   		<span>Send message</span>
   		<span class="orb-arrow orb-arrow-inline"></span>
   	</button>
   </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 **"Elementor Template (Default)"**. In the tab **"Publish"** click to "Publish" button.
3. Click to **"Edit with Elementor"** button.
4. In Elementor builder panel drag and drop "Orabel Theme" elements: "Services", "Contact Form" and more.

(Video instructions below):

{% embed url="<https://bslthemes.com/orabel/orabel_wp_doc/videos/video8.mp4>" %}
Orabel - how create Contact Page with CF7 forms with Elementor
{% endembed %}