All Collections
Forms
How to create a form
How to create a form
Michael avatar
Written by Michael
Updated over a week ago

Zagomail allows you to create forms to grow your subscribers list.

The process of form creation is easy and you can do it by following simple steps below:

STEP1

Click on forms on left side menu

STEP2

Click on "Create New Form"

STEP3

Choose the "form style" you want:

There are 4 styles:

The position of each style is displayed in "green" (see image above).

  1. Inline Form: This form appears at your page like displayed on the image below:

2. Modal: The form will be displayed as modal that can be closed by your subscribers

3. Floating box: If you choose this style, then your form it will be displayed at bottom right corner of your website like shown on the image below:

4. Floating bar: If you choose this style, then the form will be displayed as a "bar" on top of your website (see image below):

STEP4

Once you choose one of the 4 styles you want, you need to "choose the template" of your form. There are many templates that you can choose and edit on the form editor.

Click on "Choose this template".

STEP5: Edit your form style

Once you choose the template of you form, you will see the form editor. This tool will allow you to customize your form design, colors, text, everything...

In this step we will have a tour on all elements of the form editor.

Below are the easy steps you need to follow to customize your form, so please follow them in this order.

1. To edit your form name, click on the "pen" as show on the image below:

2. to "delete" or duplicate your form just click on "delete" or "duplicate" on top right of the form editor next to "save form"

3. In this part we will move the most important to design your form.

Click on "Style" (see image below)

In this stage you can customize anything in your form:

> To edit the headline of your form just click on the "headline"

In the sample below, I add " Signup to get my free course"

> To add an other field, click on the icon "+" like shown below:

Let me show you an example. Let's add the custom field: "last name"

First I click on the icon "+".

Once done , click on the "field" you just added , and just after clicking you will see "custom field" appearing like below, then select the field "Last name" .

Once you selcted "Last name", you need to add "Custom field label" to be displayed in your form.

In my sample I will add " Enter Your Last Name" (see image below):

Note: when you add it to custom field label, it will be automatically added to your form.

You can customize: Font color, Font border, Font Weight

If you want to customize the "form button" just click on the button, edit text, edit color, background...(see below)

Once all style design is done, then you need to add "settings" for your form as explained in the next step6.

Important note:

  • For the style "Modal" you can choose the popup size to one of the options: default, wide, or full-screen

  • For the style "Floating box" you can choose the popup size to one of the options: quarter, or half.

STEP6: Add settings for your form

Click on "Settings" (see below)

Once you clicked on "settings", you will see many details as displayed in the image above.

ALL THESE DETAILS ARE IMPORTANT AND REQUIRED FOR YOUR FORM.

Let's explain the importance of each part.

> Choose List: You need to select the list that will be connected to your form. In other words: All subscribers who subscribe using this form will land to the list you choose.

> Redirect to page URL: when you check it, enter the "URL" of the page where your subscribers go after they fill out your form.

let's add for example: "http://mywebsite.com/thankyou-page"

(see below)

NOTE:

If you check " Stay on current page and Display a success message", then you have to type a message that will be displayed to your subscribers after that they subscribe.

E.g: " Thank you for your subscription to my list"

> Already-subscribed redirection to thank you page: If this is checked, then it will redirect all return visitors who have already subscribed to this form to the thank you page URL you have already selected.

> Display options: Choose how and when you want your form to be displayed, there are 3 options:

-Exit intent: it displays form when we detect the visitor is about to leave the page.

-Scroll percentage: it displays form when the visitors scrolls to a specific percentage of the page.

-Timing: it displays the form when the visitor is on the page for a specific amount of time in seconds.

Add Countdown timer

If you want to add a countdown timer to your form just go to setting then click on countdown timer button and choose a date and time:

Note: to remove a timer from the form just click on "remove timer"

Add additional lists to your form

This feature is helpfull if you want your subscribers to subscribe to multiple lists at once.

Once subscriber signup via form he will be added to primary list of the form and to the additional lists you may add.

To use this feature you have to go to form settings and click on additional lists button

Then select from the dropdown the list you want to add

Once added the additional list will be added automtically to your form:

The last step is to "save form".

Note: If you want to add an other additional list you need to repeat the process described above.

STEP7: Optin

Important Note: If your list type is "Single Opt-in" then you don't need to setup "Optin" in this step.

"Optin" is ONLY FOR LISTS THAT ARE "DOUBLE OPT-IN"

The "Optin" section allows you to customize the email that will be sent to your subscribers after they opt-in via your form.

Once they subscribed they will received this "confirmation email" that includes a "confirmation link" that subscribers should click on it to be subscribed on your list.

So let's start setup process for "Optin" section.

First click on "Optin" like displayed below:

Second check "send confirmation email" like in below:

Third step is to click on "Edit Confirmation Email" green button, then a new popup will appear . You need to add the details below:

> Subject line you want: E.g: " Please confirm subscription to my course"

> In the email content, you need to add your custom content.

IMPORTANT NOTE:

- Please change content above and below [SUBSCRIBE_URL]

- Do not remove/replace [SUBSCRIBE_URL]

Once you added the content click on "Save"

The last step is to add an "After confirming redirect to" URL.

When your customer receive your confirmation email, and once he clicked on confirmation he will be redirected to this "URL"

For example in the "After Confirmation redirect to" field you can add an URL like:

STEP8: Click on "Save Form" green button to save all changes you made.

STEP9: Embed code

In this stage your form is fully step and you can embed it into your website or anywhere else by copying the "embed code" of your form.

For this click on "Embed" on the left side of the form as shown below:

once you clicked on "Embed" a popup will appears and contains embed code in "HTML", You have to copy that html code and paste it on your website.

you can use "Share" link of your form as well.

One of the most important features in the form editors are:

-Preview: it allows you to preview your form

-Reports: It gives you all details and statisctics of all your form subscribers and the conversion of your form.

Additional helpful links

Did this answer your question?