# Contact Page

**1. Create Contact Form.**

&#x20;Make sure you install and active Contact Form plugin to continue reading.

&#x20;**Step 1** - Log in to your WordPress Dashboard, go to **Contact** > **Add New** .

![](https://blobscdn.gitbook.com/v0/b/gitbook-28427.appspot.com/o/assets%2F-Lq3xPQNvxmsY3y01k2r%2F-LqjNxAvLQm-ZxFEZ64v%2F-LqjQrmaHKpL5UCS2Nbx%2Fimage_2.jpg?alt=media\&token=97dbbd80-6354-47cd-be93-3379c083b3cf)

**Step 2** - **Give a Name to your form** and **change Mail Info**.

![](https://935372695-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-MIYgnTX-5gFMC3PxtGH%2F-MJ1aYVzznyN7yhbGYVc%2F-MJ1apncu6ODvSVaKmaf%2Fhuntor45.png?alt=media\&token=97522c11-d6b8-4d34-904a-7c693e7bce6f)

```
<div class="row">

<div class="col-md-6 col-sm-12 mb-4">
[text* your-name placeholder ="Name *"]
</div>

<div class="col-md-6 col-sm-12 mb-4">
[email* your-email placeholder ="Email *"]
</div>


<div class="col-sm-12 mb-4">
[textarea your-message 40x8  placeholder ="Message" ]
</div>

<div class="col-sm-12 mb-4">
<button id='submit' type="type" class='wpcf7-form-control wpcf7-submit button-skew button-primary'><span>Send</span></button>
</div>

</div>
```

![](https://935372695-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-MIYgnTX-5gFMC3PxtGH%2F-MJ1aYVzznyN7yhbGYVc%2F-MJ1b2XuwK43VvA0kON1%2Fhuntor46.png?alt=media\&token=d407f7eb-f5ae-4595-86a0-832c699f3c8d)

Step 3 - **Message** tab. It will show all notice for you.

![](https://blobscdn.gitbook.com/v0/b/gitbook-28427.appspot.com/o/assets%2F-Lq3xPQNvxmsY3y01k2r%2F-LqjNxAvLQm-ZxFEZ64v%2F-LqjREevor9GJU328Hjk%2Fcontact2.jpg?alt=media\&token=f31d87ed-5f16-4833-83a9-0f2bc813234c)

**2. Create Contact Page**

&#x20;**Step 1** - Log in to your WordPress Administration Panel (Dashboard).&#x20;

**Step 2** - Click on **Pages** > **Add New**.&#x20;

**Step 3** - Give your page a name then Change the Editor to Backend Editor ( you need to have the Elementor plugin activated ).&#x20;

**Step 4** - Click on the Add Element button

![](https://blobscdn.gitbook.com/v0/b/gitbook-28427.appspot.com/o/assets%2F-Lq3xPQNvxmsY3y01k2r%2F-LqjNxAvLQm-ZxFEZ64v%2F-LqjROlgJtllXT01IuJQ%2Fimage_30.png?alt=media\&token=ece5f687-d78a-4e8e-993a-5a1aa9171dd4)

&#x20;**Step 5** - Select the Contact Form element.

![](https://935372695-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-MIYgnTX-5gFMC3PxtGH%2F-MJ1bH_pa2S7bwWqFnYU%2F-MJ1bVvoMrjYuxvfTfdG%2Fhuntor47.png?alt=media\&token=112ffbb6-a383-4245-9a70-c0a79f219c6a)

![](https://935372695-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-MIYgnTX-5gFMC3PxtGH%2F-MJ1bH_pa2S7bwWqFnYU%2F-MJ1biynT2347XpgWZrf%2Fhuntor48.png?alt=media\&token=cabb35bb-3659-498e-a538-893d245618fa)

**Step 6** - The **Contact Form Settings** should appear. Select the Form you want to use you can also customize the color and change the fields layout and button design .&#x20;

**Step 7** - Update / Publish your page

![](https://935372695-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-MIYgnTX-5gFMC3PxtGH%2F-Mb4bKKTgLGM_FfOTQ6G%2F-Mb4bbidxnq5fKvZEWoo%2Fimage.png?alt=media\&token=d56f95b3-df22-49b5-bb0b-4cebb777e77a)

***Note: After add contact form, you should configure email system in order to receive email from forms when customers submit forms.***&#x20;

***See more:***&#x20;

[How to Configure Email System in WordPress](https://wpdocs.gitbook.io/medilazar/faqs/faqs/i-dont-receive-email-from-contact-form.-how-can-i-do)&#x20;
