Magic Forms

Rob Howard Updated by Rob Howard

A DailyStory Magic Form enables you to integrate DailyStory with any web form on your website. This includes custom HTML forms or those built with other platforms such as Marketo, Eloqua, HubSpot and HTML form applications such as Ninja Forms.

Use DailyStory Magic Forms when you cannot use a DailyStory Web Form or do not wish to use the DailyStory API for integration.

Important to use Magic Forms, the DailyStory beacon must be installed on your website

Once setup, DailyStory Magic Forms capture customer data when forms are submitted and either associate the data with a DailyStory contact or create a new contact.

DailyStory does all this without requiring any changes to your existing forms or the addition of any custom code.

Create and Edit a Magic Form

To create a new Magic Form go to Inbound > Magic Forms. There you will find a list of all the existing Magic Forms. You can edit a Magic Form by clicking on it and you can create a new Magic Form by clicking the sidebar menu and clicking the + Create Magic Form link or clicking the + Create new button:

Clicking either will open the Magic Form editor:

The Magic Form editor is very simple, but does have several required fields.

  • Name the name of the Magic Form must be set. This is used mainly as a helpful reference for identifying the Magic Form.
  • URL of the HTML form the full URL to the page containing the existing HTML form. For example, www.dailystory.com/contact-us. The full URL, including the domain, is required.
  • Map Form Fields The form fields contain the mapping between your form and a DailyStory lead field. For example, if you have a form field named Email_Address you would map it to a DailyStory contact Email address field.
Warning either an email address or mobile phone field must be mapped to a field in your form. It is the only required form field. All other fields are optional.

Not all of your form fields will be mapped to DailyStory Magic Forms. And Magic Forms are not meant to replace your existing automation system. Rather it provides association between a visitor and an email address and attributes the lead to the appropriate campaign.

Important in addition to capturing the form fields, DailyStory will also capture the unique DailyStory Id of the visitor and their IP address. This can be disabled in advanced options.

Auto-discover Form Fields

When creating a new Magic Form you are presented with the option to "Find Forms". When clicked, the Magic Form editor can auto-discover your form fields.

DailyStory will populate the Form fields with a list of the fields it finds. You will need to then map the discovered fields to the corresponding DailyStory fields.

The left column represents the fields on your form that DailyStory found. The right column represents the DailyStory contact field to map the value to.

When a field is mapped the UI highlights that field with a green checkbox.

Tip not all fields need to be mapped. Some fields can be ignored and should be set to "Ignore this field".

Advanced Form Discovery

The advanced form discovery options are helpful when dealing with multiple forms on the same page or for non-standard form submit buttons.

Form Id

If you have multiple forms on your page and Magic Forms cannot find the right form you can use the Form Id value to provide the id of your form.

For example, given a form with the following HTML:

<form id="contact_us">
  <label>First name</label>
  <input type="text" name="firstname"/>
  ....
</form>

The Form Id value is the id of the form, e.g. contact_us.

Form Submit Button

If you receive an error that DailyStory cannot find your form's submit button, you'll need to set this up yourself. Click the "Select Form Submit Button". This will open a new browser tab and you'll notice that as your move your mouse across the screen a blue-box will appear with some cryptic information.

Navigate to your form's submit button and click it.

This will close the browser window and populate the XPath expression field. For example:

This information will tell the Magic Form exactly which element on your page is responsible for submitting the form.

Advanced Options

Magic Forms support several advanced options for unique use cases.

  • Is Shared Device - similar to the shared device option on web forms, but much less commonly used in Magic Forms, this disables the Magic Form from using the DailyStory unique id stored on the browser. This should only be used when a single device, such as an iPad, is shared by multiple people for entering form data.
  • Reverse IP address lookup - Reverse IP address lookup is enabled by default. When a magic form is submitted the IP address associated with the submission will be used to perform a reverse lookup to determine the location of the submitter. This is useful for scoring leads by country, excluding certain countries, building geo-location targeted segments, or running geo-location automations.

Troubleshooting Guide

We're sorry that you've run into issues setting up a Magic Form for your website's form. Unfortunately there are some cases where we can't make setting up the Magic Form as easy as we'd like.

If this troubleshooting guide doesn't resolve your issue, please contact us. Someone from our team would be happy to assist you.

Ensure the DailyStory beacon is installed

The DailyStory beacon must be installed on your website to use a Magic Form. The beacon adds some important JavaScript to your website that helps DailyStory connect to an existing form. When setting up the Magic Form we'll check to ensure that the beacon is installed.

There are cases where even though the beacon is installed, we still can't detect your form. Website tools, such as WP Rocket, can interfere with how we detect if the beacon is installed.

Ensure your form is using standard HTML

While we do our best to support a variety of forms, some form builders use non-standard HTML or special JavaScript to display your form. While very uncommon, we usually cannot connect to these types of forms.

Ensure your form isn't hosted in an iframe

If you are using a form provided by a 3rd party form builder and your form is hosted in an iframe DailyStory's Magic Form will be unable to connect to your form due to security restrictions built into the browser.

As an alternative, consider using an embedded DailyStory web form embedded into your website.

Known Limitations

Use of Magic Forms requires that your form uses an <input type="submit"> button. If a submit button is not found Magic Forms will use artificial intelligence to determine which button or link is associated with the form.

Important we occasionally encounter forms that do not work with DailyStory Magic Forms. If your form does not work, please let us know and we'll see about adding support.

Frequently Asked Questions

Where does the data go in DailyStory when the form is submitted?

When the Magic Form is created it is associated with a campaign. When Magic Forms processes data for a form it will create a lead in your campaign and tag that lead as associated with a Magic Form.

Will Magic Forms work with Ninja Forms?

Yes, DailyStory Magic Forms have built-in support for Ninja Forms. Ninja Forms are commonly used with WordPress websites to easily add forms. You could also consider using the DailyStory WordPress plug-in and Web Forms to replace Ninja Forms.

How can I capture free-form text?

A common form is a contact us form. These forms typically have some area where several sentences can be typed, such as describing the reason for the contact us request. DailyStory Magic Forms has a special "Description" field that should be used for this type of data.

What if I have multiple forms on a single page?

When Magic Forms detects multiple forms on a single page it attempts to use the form with the most fields. For example, a search form and a contact us form may exist on the same page. DailyStory will pick the Contact Us form because it will have more fields. However, sometimes we need a little help. Use the Advanced Form Settings to select the form submit button and set the id of the form.

My form was found, but I don't know how to map the fields

Sometimes the form fields use cryptic names like, input_1.3. In these cases it's pretty difficult to know which field is used for which form value, e.g. first name. If you run into this please contact us and we can help setup your Magic Form.

Can I start an automation when someone submits a form?

Yes, use the Magic Form submitted trigger to start an automation in your campaign when a Magic Form is submitted.

How Did We Do?

Contact