MetaLocator is a powerful lead generation tool. Your locator can allow your visitors to contact your locations directly via email. These are called Leads in MetaLocator. MetaLocator interface templates come with a Lead Generation form by default, which includes name, email and message fields. This article discusses the options available to extend the form.
Editing the Lead Form
When using the Interface Builder, you can modify your Lead Generation forms by clicking the toolbar as shown:
When you edit any fields in the Lead Form, the system will automatically display the lead form as a convenience to avoid opening the form each time a change is made. This behavior only occurs in the Interface Builder as a convenience while editing the form.
Adding Fields & Data
You can add two types of fields to the lead form. First, you can add location fields that represent location content, like address, city, state and title. These display the location data just as in the results templates and are helpful for repeating location-specific data on the lead form. Secondly, you can add lead form fields. These are form input fields which allow you to gather data from your user.
To add a field to the Lead Form, click Add Field as shown below:
Custom Fields
Notice there is a section of the Field Name list for location data fields, like Link and Custom Fields. There are 40 Custom Fields available to add to the Lead Form. To add a custom field, choose the next available Custom Field. Choose Custom 1, followed by Custom 2 and so forth as additional custom fields are required.
In this example, we have created a custom field called Favorite Color and adjusted related settings as shown below:
Just as in the results templates, the field ordering can be controlled by dragging fields up and down in the list of fields on the left.
Country & State List
When requesting the Country and State from the user, MetaLocator includes two purpose-built fields, Country List and State List. Country List is shown below:
It presents a dropdown of countries to the user which works dynamically with the State List field by automatically filtering the state list based on the user's chosen country. Shown here with United States,
And again with Australia
State List and Country List work together or either can be included alone.
The Country List can also automatically localize to the active language, shown here with the German Language
The Country List includes an option to default to the user's IP-detected country as shown:
The values chosen by the user can be saved in a custom lead field as indicated by the "Target Custom Field" setting. Shown below as displayed under Leads > View:
Category Lists
The categories can also be used to display drop-down lists and checkbox inputs in the lead form.
Note that there are two "Category" controls found in this pane. The description above indicates we are adding form inputs, where as the other Category option is available to simply display the categories of the chosen location.
Like other list controls, choose the custom field that will be used to save the user's choices. If the user chooses multiple options, they will be saved as a comma-delimited in the lead record.
In the example below we are displaying the categories as Vertical Collapse Groups of Checkboxes, and the user's choices will be stored in the "Custom 3" lead field.
Category can be added to the Lead Form multiple times, just as with the search form. This is preferable when you want the users choices to be stored in separate fields.
The form inputs can also be pre-set to match with any choices the user made in the search form by enabling this checkbox:
Custom Lead Form Field Templates
More advanced plans have access to the Template Editor as shown below. In that editor Handlebars templates can be modified to include custom output including conditional logic, loops and hidden fields.
In custom templates, the input name attribute must match the custom field chosen, as shown below:
<textarea id="custom2" name="custom2"></textarea>
The system can also populate location data values in the handlebars templates, such as this text input that pre-populates the location name.
<input type="text" id="custom2" name="custom2" value="{{name}} is great!" />
The result is shown below, notice the dynamic replacement of {{name}}
Custom Checkboxes and Select Fields
Creating checkbox, radio and select inputs is a matter of updating the template to include the required form HTML.
This is an example of 3 checkboxes
<span data-element-name="custom_2">
<h6>Favorite Color</h6>
<div>
<input type="checkbox" value="Red" name="custom2[]" id="customRed">
<label for="customRed" class="form-check-label">
Red
</label>
</div>
<div>
<input type="checkbox" value="Blue" name="custom2[]" id="customBlue" value="Blue">
<label for="customBlue" class="form-check-label">
Blue
</label>
</div>
<div>
<input type="checkbox" value="Green" name="custom2[]" id="customGreen" value="Green">
<label for="customGreen" class="form-check-label">
Green
</label>
</div>
</span>
Which displays as follows:
Notice that each input value is called "custom2[]". This will be interpreted as a list of items by MetaLocator and will display as a list in the Lead Email Body Template when included as
{{template_item.leadcustom2}}
Drop-down lists are built in a similar fashion, notice below we have customized the template for the Custom 1 field to display a drop-down containing the values 1, 2 and 3.
The drop-down displays as shown below:
This will be interpreted as a list of items by MetaLocator and will display as a list in the Lead Email Body Template when included as
{{template_item.leadcustom1}}
Those values will appear in the email as shown below:
Custom field values are displayed in the back-end as shown below by clicking Leads, then the View butto
Programmatically aligning lead form inputs with active search selections
It may be desirable for a custom lead field to be automatically selected based on an active search option. For example, a user searches for 53211 and that value should be passed to the lead form as a hidden field. A second example: a user searches for a Product, finds a dealer, and the product list in the lead form should be automatically set to the product chosen in the search form.
The search form state is exposed to the lead form template as "ml_formstate".
The example above, showing a custom field called "custom2" could be initialized to a list of selected categories (called "tags" in code)
<input type="hidden" name="custom2" value="{{#tocsv ml_formstate.tags}}" />
Similarly a select option could be set to the value of a category as below:
<option value="Cleaning" {{#if_in_array 312 ml_formstate.tags }}selected{{/if_in_array}}>Cleaning</option>
Managing Leads
Each time a user completes this form, the data will be stored in the Leads as shown below. Read more about our Lead system here.