Create signup form

IMPORTANT NOTE: This article may contain outdated information. For the most up-to-date information related to this topic, please refer to the Hungarian version of this page.
In case you do not speak Hungarian, you can always translate the page with Google Translate.

By the end of the tutorial you will able to create signup forms with custom fields that you can embed into your website or blog.

In the left menu click the name of the list and then the Forms folder to open it and after the "Create new form" option. Or if you are at a list screen click the Forms tab and then the "Create new form" button.

If you left the create forms options checked when you created the new list, you already have two forms: a signup form and an update form so, it' is not necessary to create a new one. To edit an existing form click on the form name (in left menu or in the "Forms" tab screen and then the "Edit form" tab. The processes of creating a new form and the editing of an existing form are very similar.

So when you create a new form or edit an existing one it starts with the screen below.

The form title will be displayed in the left menu and the form list of the list. This helps you to identify the form so choose a meaningful name. You can create two types of forms: signup or profile update. In this tutorial we're describing the method of creating a signup form so, leave the Signup option checked.

You can receive notifications about every new signup. You can modify the subject line of the notification letter if you want to describe your process more specifically. For example: Signup to my free study

At the last option you can turn on geolocation based on IP addresses. In this case SalesAutopilot will save the following data when a subscriber opted in or updates his/her data: latitude, longitude, country name and code, county/state/area name and id, city name and id. Because we're using a real time database for the most precise data, determining an IP address costs 0.01 EUR per request.

When you finished the settings click the "Next" button.

At the second step you can set the subscription method of the form. We strongly recommend you to use double opt-in process. If you want to embed your form into an existing page leave the embed option checked at the second setting. If you want your form to be a standalone page choose the other option. Click the "Next" button to continue to the next step.

At the third step of the creating form wizard you can assign fields to the form and determine the appearance of the form. The Form title will be the main title of the form. The Form description will appear right below. You can use HTML tags here or format the description with the built-in WYSIWYG editor by clicking "Turn on HTML editor".

Select the Subsciber's e-mail address field from the Adding form element dropdown list and click "Add this field to the form" button.

The field will appear in the Form fields section with yellow backround, this means that the field is being edited right now. You can change the label of the field and the field type. Click to the "Save field" button to finalize field editing and add it to the form. Then add the First name field to the form. Before you save this field you can see a new option: Required field?

If you check this option this means that the subscriber has to fill in the field. Change the error message if you want to. You can't define an error message to the e-mail field because it's handled automatically. SalesAutopilot checks the syntax of the e-mail address and if it already exists in the list. Click "Save field" again to add the field to the form permanently.

Now you have tow fields on the form. Add Last name field too. You can edit a form field by clicking the "Edit" link to it's right hand side or you can delete the field by clicking the "Delete" link.

You can add custom texts to the form to instruct the subscriber about certain things, for example your privacy policy.

At the "Label for form submit button" you can define the label of the submit button which will appear at the bottom of the form.

Below that there are the form layout and form colors options. Try to choose a layout that fits best into your website's color scheme, but at the same time make the form stand out enough to be noticed. Should you wish, your webmaster will be able to make changes to these colors later.

If you want to use your own colors check the "Unique colors" option and define the header, background and text colors. If you don't want any special CSS formatting to your form select "Set a unique appearance to the form" option.

Click "Show form preview" to view how the form will look like. A new window will open with the form preview.

If you are satisfied with the result click the "Next button".

In the fourth step of the wizard you can set the acknowledgment pages of the form. If you've selected double opt-in method you have to define the Form feedback page first. If you want to use a separate page on your website for this choose "I will use a pre-made HTML page as the feedback page" option and type the exact URL of the page. Otherwise write the feedback page text. Please customize the default text. You can use mergetags to personalize the text. Click to the [...] icon in the HTML editor and insert the mergetag of the field you want to use.

With the WYSIWYG editor you can format your acknowledgement text nicely. If you turn off the HTML editor you can copy your own HTML code if you want. In that case you can still use merge tags for personalizing the page.

The Multiple signup with the same e-mail address option by default simply forbids to signup a user with the same e-mail address as another one, it displays an error message for the subscriber. There are some cases when you want to display a different feedback page to the subscriber if he/she tries to subscribe with an existing e-mail address. In that case select the "Display the second acknowledgement page after signup" option and set this acknowledgment page as you have seen before.

Set the Feedback page after confirmation this will appear when the subscriber confirms the signup. You have the same options here as at the Form feedback page. When you finish click the "Next" button.

Finally copy the HTML source code of the form and embed it into your webpage. There are several guides available for embedding a form into the most popular content management systems (Wordpress, Drupal, Joomla, Google Sites). Click their icons to open the guide. At the bottom you can define the e-mail address where the form source will be sent. Click the "Next" button and the form review page will open and you will receive the form source code along with embedding instructions by e-mail.

On the form review page there is a message that you have to create a double opt-in confirmation e-mail. This e-mail will be sent right after signup and includes a link to confirm signup.
Below that you can review the details of the form. If you want to edit the form click the "Edit form" tab, to preview the final form click the "Preview form" tab.