How to Create a CONTACT form in Admin Panel

How to Create a CONTACT form in Admin Panel

How to Create a CONTACT form in Admin Panel

This form will appear inside the contact screen. It can also appear in every screen if the user decides it through the UI Files

You can Create and manage your forms with hauzd admin panel go to the  Forms  Section and click on   Create your first form  

Pick the type of form you would like to create. We need to create a "Leads Generation" and choose the "Blank" option to create it from scratch

In this screen you will be able to create the new form.

1. Here you will decide if you want our own form or a Third-Party Form (External form)
2. Click on the fields you want to add to the form
3. This is a preview of the form and the order of the fields
4. You can drag and reposition these fields by using this handler
5. Click on save to start using it

 Important : Email Field and Form Title are mandatory. 

 Important There are some things to know to embed third-party forms into the app:

*Form page should not contain popups!
*The form should have two buttons with button HTML tag. These buttons should be like:

<button id="btnClose" type="button" class='' onclick="'btnClose');window.parent.postMessage('btnClose', '*');">Close</button>


<button id="btnClose" type="button" class='' onclick="'btnCancel');window.parent.postMessage('btnCancel', '*');">X</button>

You have to respect the parameters id="btnClose", type="button" and onclick functions.

With that, the app will trigger these buttons to go back/close the form into the app.

Inputs type="submit" will not work for this.

You can modify the label, design of the buttons and place it anywhere in your form.

After creating it you will see it in the form section and it will start appearing in the app if the UI buttons are imported (See beginning of the post)

You will see some actions too:

Active - Click on it and you will deactivate the form, click again to activate the form.
Edit - Go to edition mode, add new fields or change the hints
Delete - Removes the form
Export -X leads - Once the form is active and "catching" leads, you will be able to export them and download a .xlsx file
Preview - Useful to see how the form will look in the app