Sales Web Forms: Build, Edit, and Embed

1 min read

 

Create a lead-capture form, adjust its fields and labels, and embed it on your website

Overview

A Sales web form captures lead information from a page outside of FranConnect, such as your website, and adds it to the Sales module. Sales web forms are built and maintained in Manage Web Form Generator. This article covers three tasks: building a new form, editing the fields on an existing form, and embedding the finished form on a web page.

Important: Manage Web Form Generator appears in more than one Admin section (Sales, Information Manager, and Marketing). Sales web forms are managed under Admin > Sales only.

1. Open Manage Web Form Generator

  1. Go to Admin > Sales.
  2. Select Manage Web Form Generator.

Figure 1: Manage Web Form Generator in the Sales section of Admin

The page lists every existing Sales web form with its format, number of columns, and last update. Use Create New Form to start a new form, or the Action gear on a row to work with an existing one.

Figure 2: The Web Forms list with Create New Form and the Action gear highlighted

2. Build a New Web Form

Creating a form is a four-step process: Details, Design, Settings, and Confirmation.

  1. On the Web Forms page, select Create New Form.
  2. On the Basic Details step, complete the fields described below.
  3. Select Save & Next to continue to the Design step (see section 3).
  4. Continue through the Settings and Confirmation steps to finish the form.
FieldWhat to enter
Form Name (required)Internal name that identifies the form in the Web Forms list.
Form Title (required)Title shown on the form. Clear Display Form Title to hide it.
Form DescriptionOptional text describing the form.
Form Format and # of ColumnsPage format of the form (default Single Page) and number of columns (default 1).
Default Field Label AlignmentAlignment of field labels (default Left).
Form LanguageLanguage of the form (default English (US)).
iframe Width and iframe HeightSize used in the iframe embed code (defaults 100% and 500).
Form URL (required)The unique name that completes the form’s web address. Avoid special characters such as ! @ % # $ ^ & * _ : ; , < > \.
Secure WebformOptional setting for secure web forms.

 

Figure 3: Basic Details for a new web form (iFrame Width and Height highlighted)

3. Edit the Fields on a Web Form

Field layout and labels are managed on the Design step.

  1. Go to Admin > Sales > Manage Web Form Generator.
  2. Select the Action gear next to the form, and then select Modify.
  3. Open the Design step.

Figure 4: The Design step with the Qualification Details group of Available Fields expanded

Add fields from Available Fields

The Available Fields panel on the left lists the system fields you can place on the form, grouped by area (for example Primary Info, Qualification Details, and Personal Profile).

  1. In Available Fields, select the group that contains the field, such as Qualification Details.
  2. Optionally, enter the field name in Search fields.
  3. Drag the field onto the form and drop it where you want it to appear.

Reorder fields

Rearrange the fields on the Design page to match the order you want candidates to see. The order of fields on the web form is what visitors see on the live form.

Important: Changing the field order on a web form does not change the order of fields on the lead’s Summary page.

Relabel a field

  1. On the Design step, hover over the field you want to change. An edit (pencil) icon appears at the right side of the field row.
  2. Select the edit icon to open the Modify Field dialog.
  3. Enter the new text in Label, and then select Save.

Figure 5: The edit icon on a field row

Figure 6: The Modify Field dialog

Avoid special characters such as < > \ in a label. Relabeling is useful when a field’s wording needs to match the form, for example when you reword a consent statement pulled from Qualification Details.

Save your changes

Use Save & Preview (top right of the form) to review the form or Save & Next at the bottom of the page to continue to the next step. Previous returns to the earlier step and Cancel exits without saving.

4. Embed the Form on a Web Page

  1. Go to Admin > Sales > Manage Web Form Generator.
  2. Select the Action gear next to the form, and then select Copy URL.
  3. In the dialog, select iFrame Embed Code.
  4. Copy the code and paste it into the page, stream, or blog post where the form should appear.

Figure 7: Copy URL in the Action menu

Figure 8: The iFrame Embed Code option

The dialog opens on Host URL, which provides the direct link to the form for sharing or emailing. Select iFrame Embed Code when you need the code to embed the form on a web page. The embed code follows this pattern:

<iframe frameborder='0' width='100%' height='500' src='https://<your-system>/fc/extforms/<form-url>?refLoc=ifrm' title='<form name>'></iframe>

Important: The iframe URL is not the lead-parsing email. The web form’s iframe URL is the address your website loads to display the form. The email address used to parse leads (for example, an address ending in @myfranconnect.com) is a separate address and cannot be used to embed a form. Likewise, the URL you use to sign in to FranConnect is not the iframe URL.

5. Send a Web Form from a Lead Profile

A web form can also be sent to a lead directly from the lead’s profile, using the web form keyword. When the form is sent this way, it prefills the form fields with the lead’s existing data, so the lead only needs to review the form and complete anything that is missing.

Note: Prefilling applies only when the form is sent from the lead profile using the web form keyword. A form embedded on a web page with the iframe code opens without any lead data.

Was this article helpful?
Your feedback helps us improve our documentation.