Create and manage form

1. Enable Form

From the app admin, go to the Manage Forms from the left sidebar, then edit the Contact Form was been generated automatically by our app.

Basically, you only need to enable the form in the Active Form tab, then click the Save & Continue Edit or Save button.

Now, let open your frontend and you can see the widget on the right bottom. Click it to open our popup contact form.

The contact form works with default setting and use the store owner email to receive email submissions.

2. Embed Form

To embed the form in any page/post you want, you need to get the embed code as HTML code or Short-code of the form.

In the Active form tab, you need to select Embed Form, then get the embed code (HTML/Short-code) to embed where you want to place the form.

For example to embed a form on a page you follow these steps:

  • Select Pages in the Online Store.

  • Select the page you want to add the form.

  • Finally, insert the form's code to the content (If you insert HTML code then you need to click on "<>" icon).

3. Add form on Online Store 2.0

The application supports adding form to the store in an intuitive way compatible with Online Store 2.0.

4. Manage Form

Now, you can customize your form styles, add new fields or change email settings, etc.

4.1 Form Fields

In the Form Fields tab, you can set the content for your form by adding title, description, and fields to the form.

Add validations to the field

To do this, go to Edit field -> Validations

At this tab, you can set required field or add other required attributes such as: url, date, number, min, max, text length, etc.

Conditional Logic

If you want to set the display conditions of the field, go to Edit field -> Conditional Logic

Add checkbox to agree to add to email list ( Subscribe newsletter)

In case you don't want to add customers to your email list automatically, add the Agree to add to the subscribe email list field to your form. If your customer clicks, their information will be saved to the email list and vice versa.

Once done, you will have the result as shown below.

Add tracking code

You can use the tracking code to add to each form to track the conversion of the form.

Please go to Manage Forms -> Edit Form -> Form Fields -> Tracking code after the form is successfully submitted -> Add tracking code

4.2 Form Styles

4.3 Email Settings

At this tab, you need to pay attention to completely and correctly fill in the required information fields so that sending and receiving emails after the customer submits the form goes smoothly.

Mail Send: This is the section for you to set up the email addresses to be notified when the form is submitted Email response: the email to be filled in the form. Name response: the name to be filled in the form. These 2 fields are used to email the response to the form submitter. Email Message Template: The email content is sent to the store admin, you can add form fields to this body using the select-box above the content box. Auto Response Template: The email content is automatically sent to the person who just submitted the form.

4.4 Info Box

Add Google Map to Info Box

To do this you need to add the Google maps embed code to the Custom HTML box at the bottom.

To get the Google Maps embed code, go to the website: https://www.embedmymap.com/

4.5 Popup Widget

In this tab, you can customize the style, position of the widget and can even disable/enable the widget on mobile devices.

4.6 Multi-Step

You can split steps for forms with multiple fields.

Multi-step form example

4.7 Email Integrations

When you click on each email service, you'll see instructions for integration.

Create a new customer account with form

The app integrates form with Shopify to create new customer account. You need to enable this feature in the Email Integrations tab.

With this feature enabled, after the customer clicks the Submit button, an email will be sent to the customer for them to activate account.

After the customer clicks the Active your account button, their new customer account will be created.

Last updated