> ## Knowledge Base Index
> Fetch the complete knowledge base index at: https://support.easystore.co/sitemap.xml
> Use this file to discover available pages before exploring further.
> Pure-Markdown content can be obtained by appending a '.md' suffix to the content URLs listed in the sitemap (without the trailing slash).
# Contact Form Plus +
### In this article:
1. [Installation of Contact Form Plus app](#1-1-installation-of-contact-form-plus-app)
2. [How to add image in Contact Form Plus+?](#1-2-how-to-add-image-in-contact-form-plus)
3. [Important Notes](#1-3-important-note)
# 1. Installation of Contact Form Plus app
Contact Form Plus+ makes it possible for you as a business, to collect a survey responses from customers by using this customizable contact form.
**Step 1: **You can login into your EasyStore admin panel > click on [Apps](https://admin.easystore.co/apps) > Explore Apps > Search **Contact Form Plus** and install this app
**Step 2 : **Complete the Contact Form Setting
1. **Recipient Email** - Any submission of this contact form would be sent to this email.
2. **Form Width** - The width that would be displayed on the website. 800 pixel is recommended.
3. **Background Colour** - The background colour of the contact form which would be shown on your online store.
4. **Text Colour** - The standardized text colour that would appear on the contact form.
5. **Thank You Message** - A short message prompt that will appear right after they submitted the form.
**Step 3 :** The button will appear on the bottom of the form to let your customers send out the completed form.
Example:
**Step 4 : **You can select multiple input fields in one form > Choose a **Text field** > **Add selected input**
|| 📌 Note: Kindly be informed that after select or change selection have to click Add selected input
For example : **Checkbox > Add selected input**
The changes will show at the **Output** (scroll down the page)
**Step 5 : **Output - Fill in the title, description about this form, required information.
**Step 6 :** Save all settings and a 'Contact Us' tab will automatically be added to your top navigation menu. If you would like to rename the page, you can do so by going to **Channels > Online Store > Navigations** > Contact Form Plus > Edit > Insert your preferred title > Save. May also refer to [3. Important Notes](#1-3-important-note)
---
# 2. How to add image in Contact Form Plus?
For some cases, you wish to upload a QR Code image to allow your customers to scan it. Below would be the steps on how to insert a QR Code image on your Contact Form Plus. First thing first, you need to have the QR Code image link. May refer to the steps below to obtain the image URL.
**Step 1 : **Click on **Products** > Click **Add Product** > Click **Images** > **Add Image** > **Upload Image** and you can obtain the **Image URL** here
**Step 2 **: Next, click on **Apps > Contact Form Plus** > Scroll down to Output and paste the code below on select which column that you wish to add the QR Code image.
```
```
For example, we add in the Form description column here:
| 💡 Tips : You can adjust the **width** px and **height** px value for the QR Code image size
**Step 3 : **Save all settings and here is the final result.
---
# 3. Important Note
1. It will create a new page on your store, goes by the name Contact Us. If you would like to rename the page, you can do so by going to Online Store > Navigations > Contact Us > Edit
2. If it does not appear under Navigation, you can head over to Channels > Online Store > Navigation and Add New Navigation > Select Links and input it as below example:
|| Make sure the URL link is "https://" and the handle comes with "yourdomainname/a/contact-form-plus" to prevent the contact us form is unable to connect
**URL** = https://
**Handle** = yourdomainname.com/apps/contact-form-plus
May refer to [ [THIS ARTICLE](https://support.easystore.co/en/article/customize-top-navigation-menu-18hx39/) ] for further detailed guidance.