{"Status":true,"Message":"","Response":{"post":{"postuid":"dw3bqm0v03","tenantuid":"d8b744fc-2e70-4089-bb80-dd1d08f6c7b2","projectuid":"239698c5-f7eb-4574-8cc8-c6568f08b3a0","title":"Magic Forms","slug":"article/dw3bqm0v03-daily-story-magic-forms","html":"\u003Cp\u003EA 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.\u003C/p\u003E\u003Cp\u003EUse DailyStory Magic Forms when you cannot use a \u003Ca href=\u0022https://docs.dailystory.com/article/5itiwxukqb-daily-story-web-forms\u0022\u003EDailyStory Web Form\u003C/a\u003E\u0026#160;or do not wish to use the \u003Ca href=\u0022https://dev.dailystory.com/docs/developer-guide\u0022\u003EDailyStory API\u003C/a\u003E\u0026#160;for integration.\u003C/p\u003E\u003Ccite class=\u0022recommended\u0022\u003E\u003Cspan class=\u0022title\u0022\u003E\u003Ci class=\u0022fa-duotone fa-circle-exclamation\u0022 aria-hidden=\u0022true\u0022\u003E\u003C/i\u003ERecommended\u003C/span\u003E\u003Cp\u003E\u003Cstrong\u003EImportant\u003C/strong\u003E to use Magic Forms, the \u003Ca href=\u0022/article/ppg0z9xv1v-installing-the-daily-story-tracking-tag\u0022\u003EDailyStory beacon\u003C/a\u003E must be installed on your website\u003C/p\u003E\u003C/cite\u003E\u003Cp\u003EOnce 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.\u003C/p\u003E\u003Cp\u003EDailyStory does all this without requiring any changes to your existing forms or the addition of any custom code.\u003C/p\u003E\u003Ch3\u003ECreate and Edit a Magic Form\u003C/h3\u003E\u003Cp\u003ETo create a new Magic Form go to \u003Ccode\u003EInbound \u0026gt; Magic Forms\u003C/code\u003E. 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 \u002B Create Magic Form link or clicking the \u002B Create new button:\u003C/p\u003E\u003Cimg class=\u0022lazy-load\u0022 data-src=\u0022https://graffiti-auf7e6dwhxhcbwek.z03.azurefd.net/d8b744fc-2e70-4089-bb80-dd1d08f6c7b2/239698c5-f7eb-4574-8cc8-c6568f08b3a0/d0bbdefe9751e0e7c8030a5204697d36.png\u0022 style=\u0022\u0022 alt=\u0022\u0022/\u003E\u003Cp\u003EClicking either will open the Magic Form editor:\u003C/p\u003E\u003Cimg class=\u0022lazy-load\u0022 data-src=\u0022https://graffiti-auf7e6dwhxhcbwek.z03.azurefd.net/d8b744fc-2e70-4089-bb80-dd1d08f6c7b2/239698c5-f7eb-4574-8cc8-c6568f08b3a0/8d441d14d408ba7b8c49677ae00ff17b.png\u0022 style=\u0022\u0022 alt=\u0022\u0022/\u003E\u003Cp\u003EThe Magic Form editor is very simple, but does have several required fields.\u003C/p\u003E\u003Cul\u003E\u003Cli\u003E\u003Cb\u003EName\u003C/b\u003E\u0026#160;the name of the Magic Form must be set. This is used mainly as a helpful reference for identifying the Magic Form.\u003C/li\u003E\u003Cli\u003E\u003Cb\u003EURL of the HTML form\u003C/b\u003E\u0026#160;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.\u003C/li\u003E\u003Cli\u003E\u003Cb\u003EMap\u003C/b\u003E \u003Cb\u003EForm Fields\u003C/b\u003E\u0026#160;The form fields contain the mapping between your form and a DailyStory lead field. For example, if you have a form field named\u0026#160;\u003Ccode\u003EEmail_Address\u003C/code\u003E\u0026#160;you would map it to a DailyStory contact\u0026#160;\u003Ccode\u003EEmail address\u003C/code\u003E field.\u003C/li\u003E\u003C/ul\u003E\u003Ccite class=\u0022warning\u0022\u003E\u003Cspan class=\u0022title\u0022\u003E\u003Ci class=\u0022fa-duotone fa-circle-exclamation\u0022 aria-hidden=\u0022true\u0022\u003E\u003C/i\u003EWarning\u003C/span\u003E\u003Cp\u003E\u003Cstrong\u003EWarning\u003C/strong\u003E 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.\u003C/p\u003E\u003C/cite\u003E\u003Cp\u003ENot 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.\u003C/p\u003E\u003Ccite class=\u0022recommended\u0022\u003E\u003Cspan class=\u0022title\u0022\u003E\u003Ci class=\u0022fa-duotone fa-circle-exclamation\u0022 aria-hidden=\u0022true\u0022\u003E\u003C/i\u003ERecommended\u003C/span\u003E\u003Cp\u003E\u003Cstrong\u003EImportant\u003C/strong\u003E 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.\u003C/p\u003E\u003C/cite\u003E\u003Ch3\u003EAuto-discover Form Fields\u003C/h3\u003E\u003Cp\u003EWhen creating a new Magic Form you are presented with the option to \u0026#34;Find Forms\u0026#34;. When clicked, the Magic Form editor can auto-discover your form fields.\u003C/p\u003E\u003Cp\u003EDailyStory 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.\u003C/p\u003E\u003Cimg class=\u0022lazy-load\u0022 data-src=\u0022https://graffiti-auf7e6dwhxhcbwek.z03.azurefd.net/d8b744fc-2e70-4089-bb80-dd1d08f6c7b2/239698c5-f7eb-4574-8cc8-c6568f08b3a0/34abac44cc9d3c90dd8581b3eefe011e.png\u0022 style=\u0022\u0022 alt=\u0022\u0022/\u003E\u003Cp\u003EThe left column represents the fields on your form that DailyStory found. The right column represents the DailyStory contact field to map the value to.\u003C/p\u003E\u003Cp\u003EWhen a field is mapped the UI highlights that field with a green checkbox.\u003C/p\u003E\u003Ccite class=\u0022recommended\u0022\u003E\u003Cspan class=\u0022title\u0022\u003E\u003Ci class=\u0022fa-duotone fa-circle-exclamation\u0022 aria-hidden=\u0022true\u0022\u003E\u003C/i\u003ERecommended\u003C/span\u003E\u003Cp\u003E\u003Cstrong\u003ETip\u003C/strong\u003E not all fields need to be mapped. Some fields can be ignored and should be set to \u0026#34;Ignore this field\u0026#34;.\u003C/p\u003E\u003C/cite\u003E\u003Ch3\u003EAdvanced Form Discovery\u003C/h3\u003E\u003Cp\u003EThe advanced form discovery options are helpful when dealing with multiple forms on the same page or for non-standard form submit buttons.\u003C/p\u003E\u003Cimg class=\u0022lazy-load\u0022 data-src=\u0022https://graffiti-auf7e6dwhxhcbwek.z03.azurefd.net/d8b744fc-2e70-4089-bb80-dd1d08f6c7b2/239698c5-f7eb-4574-8cc8-c6568f08b3a0/dbce4a71603a76ef0d26da368f3d4a0d.png\u0022 style=\u0022\u0022 alt=\u0022\u0022/\u003E\u003Ch4\u003EForm Id\u003C/h4\u003E\u003Cp\u003EIf 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.\u003C/p\u003E\u003Cp\u003EFor example, given a form with the following HTML:\u003C/p\u003E\u003Cform id=\u0022contact_us\u0022\u003E\u003Cbr\u003E  \u003Clabel\u003EFirst name\u003C/label\u003E\u003Cbr\u003E  \u003Cinput type=\u0022text\u0022 name=\u0022firstname\u0022/\u003E\u003Cbr\u003E  ....\u003Cbr\u003E\u003C/form\u003E\u003Cp\u003EThe Form Id value is the id of the form, e.g. \u003Ccode\u003Econtact_us\u003C/code\u003E.\u003C/p\u003E\u003Cimg class=\u0022lazy-load\u0022 data-src=\u0022https://graffiti-auf7e6dwhxhcbwek.z03.azurefd.net/d8b744fc-2e70-4089-bb80-dd1d08f6c7b2/239698c5-f7eb-4574-8cc8-c6568f08b3a0/25a91cc186332051c9c0e9ab14c52380.png\u0022 style=\u0022\u0022 alt=\u0022\u0022/\u003E\u003Ch4\u003EForm Submit Button\u003C/h4\u003E\u003Cp\u003EIf you receive an error that DailyStory cannot find your form\u0026#39;s submit button, you\u0026#39;ll need to set this up yourself. Click the \u0026#34;Select Form Submit Button\u0026#34;. This will open a new browser tab and you\u0026#39;ll notice that as your move your mouse across the screen a blue-box will appear with some cryptic information.\u003C/p\u003E\u003Cp\u003ENavigate to your form\u0026#39;s submit button and click it.\u003C/p\u003E\u003Cimg class=\u0022lazy-load\u0022 data-src=\u0022https://graffiti-auf7e6dwhxhcbwek.z03.azurefd.net/d8b744fc-2e70-4089-bb80-dd1d08f6c7b2/239698c5-f7eb-4574-8cc8-c6568f08b3a0/229c62c03f1337d2d12af3dea50e5198.png\u0022 style=\u0022\u0022 alt=\u0022\u0022/\u003E\u003Cp\u003EThis will close the browser window and populate the XPath expression field. For example:\u003C/p\u003E\u003Cimg class=\u0022lazy-load\u0022 data-src=\u0022https://graffiti-auf7e6dwhxhcbwek.z03.azurefd.net/d8b744fc-2e70-4089-bb80-dd1d08f6c7b2/239698c5-f7eb-4574-8cc8-c6568f08b3a0/65910b59481dd0bc42b5b3da505bc512.png\u0022 style=\u0022\u0022 alt=\u0022\u0022/\u003E\u003Cp\u003EThis information will tell the Magic Form exactly which element on your page is responsible for submitting the form.\u003C/p\u003E\u003Ch3\u003EAdvanced Options\u003C/h3\u003E\u003Cp\u003EMagic Forms support several advanced options for unique use cases.\u003C/p\u003E\u003Cul\u003E\u003Cli\u003E\u003Cb\u003EIs Shared Device\u003C/b\u003E - similar to the \u003Ca href=\u0022https://docs.dailystory.com/article/h766zz7ies-create-or-edit-a-web-form#shared_device\u0022\u003Eshared device option on web forms\u003C/a\u003E, 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.\u003C/li\u003E\u003Cli\u003E\u003Cb\u003EReverse IP address lookup\u003C/b\u003E - 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.\u003C/li\u003E\u003C/ul\u003E\u003Cimg class=\u0022lazy-load\u0022 data-src=\u0022https://graffiti-auf7e6dwhxhcbwek.z03.azurefd.net/d8b744fc-2e70-4089-bb80-dd1d08f6c7b2/239698c5-f7eb-4574-8cc8-c6568f08b3a0/079c3231450e76a23055bbf553b675bd.png\u0022 style=\u0022\u0022 alt=\u0022\u0022/\u003E\u003Ch3\u003ETroubleshooting Guide\u003C/h3\u003E\u003Cp\u003EWe\u0026#39;re sorry that you\u0026#39;ve run into issues setting up a Magic Form for your website\u0026#39;s form. Unfortunately there are some cases where we can\u0026#39;t make setting up the Magic Form as easy as we\u0026#39;d like.\u003C/p\u003E\u003Cp\u003EIf this troubleshooting guide doesn\u0026#39;t resolve your issue, \u003Ca href=\u0022https://dailystory.com/contact-us\u0022\u003Eplease contact us\u003C/a\u003E. Someone from our team would be happy to assist you.\u003C/p\u003E\u003Ch4\u003EEnsure the DailyStory beacon is installed\u003C/h4\u003E\u003Cp\u003EThe \u003Ca href=\u0022/article/ppg0z9xv1v-installing-the-daily-story-tracking-tag\u0022\u003EDailyStory beacon\u003C/a\u003E 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\u0026#39;ll check to ensure that the beacon is installed.\u003C/p\u003E\u003Cp\u003EThere are cases where even though the beacon is installed, we still can\u0026#39;t detect your form. Website tools, such as WP Rocket, can interfere with how we detect if the beacon is installed.\u003C/p\u003E\u003Ch4\u003EEnsure your form is using standard HTML\u003C/h4\u003E\u003Cp\u003EWhile 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.\u003C/p\u003E\u003Ch4\u003EEnsure your form isn\u0026#39;t hosted in an iframe\u003C/h4\u003E\u003Cp\u003EIf you are using a form provided by a 3rd party form builder and your form is hosted in an iframe DailyStory\u0026#39;s Magic Form will be unable to connect to your form due to security restrictions built into the browser.\u003C/p\u003E\u003Cp\u003EAs an alternative, consider using an embedded \u003Ca href=\u0022/article/5itiwxukqb-daily-story-web-forms\u0022\u003EDailyStory web form\u003C/a\u003E embedded into your website.\u003C/p\u003E\u003Ch3\u003EKnown Limitations\u003C/h3\u003E\u003Cp\u003EUse of Magic Forms requires that your form uses an\u0026#160;\u003Ccode\u003E\u0026lt;input type=\u0026#34;submit\u0026#34;\u0026gt;\u003C/code\u003E\u0026#160;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.\u003C/p\u003E\u003Ccite class=\u0022recommended\u0022\u003E\u003Cspan class=\u0022title\u0022\u003E\u003Ci class=\u0022fa-duotone fa-circle-exclamation\u0022 aria-hidden=\u0022true\u0022\u003E\u003C/i\u003ERecommended\u003C/span\u003E\u003Cp\u003E\u003Cstrong\u003EImportant\u003C/strong\u003E we occasionally encounter forms that do not work with DailyStory Magic Forms. If your form does not work, \u003Ca href=\u0022https://www.dailystory.com/contact-us\u0022\u003Eplease let us know\u003C/a\u003E\u0026#160;and we\u0026#39;ll see about adding support.\u003C/p\u003E\u003C/cite\u003E\u003Ch3\u003EFrequently Asked Questions\u003C/h3\u003E\u003Ch4\u003EWhere does the data go in DailyStory when the form is submitted?\u003C/h4\u003E\u003Cp\u003EWhen 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.\u003C/p\u003E\u003Ch4\u003EWill Magic Forms work with Ninja Forms?\u003C/h4\u003E\u003Cp\u003EYes, 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 \u003Ca href=\u0022/article/8omibw2171-word-press-and-daily-story-integration\u0022\u003EDailyStory WordPress plug-in\u003C/a\u003E and \u003Ca href=\u0022/article/5itiwxukqb-daily-story-web-forms\u0022\u003EWeb Forms\u003C/a\u003E to replace Ninja Forms.\u003C/p\u003E\u003Ch4\u003EHow can I capture free-form text?\u003C/h4\u003E\u003Cp\u003EA 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 \u0026#34;Description\u0026#34; field that should be used for this type of data.\u003C/p\u003E\u003Ch4\u003EWhat if I have multiple forms on a single page?\u003C/h4\u003E\u003Cp\u003EWhen 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.\u003C/p\u003E\u003Ch4\u003EMy form was found, but I don\u0026#39;t know how to map the fields\u003C/h4\u003E\u003Cp\u003ESometimes the form fields use cryptic names like, \u003Ccode\u003Einput_1.3\u003C/code\u003E. In these cases it\u0026#39;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.\u003C/p\u003E\u003Ch4\u003ECan I start an automation when someone submits a form?\u003C/h4\u003E\u003Cp\u003EYes, use the \u003Ca href=\u0022/article/pffq9y943p-autopilot-triggers\u0022\u003EMagic Form submitted trigger\u003C/a\u003E to start an automation in your campaign when a Magic Form is submitted.\u003C/p\u003E","publish_status":0,"post_type":"Article","author":{},"featured_image_updating":false,"meta_description":"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 \u0026#160;or do not wish to use the DailyStory API \u0026#160;for integration. Important to use Magic Forms, the DailyStory beacon must be installed on your website Once setup, DailyStory Magi ...","display_toc":true,"has_workingcopy":false,"allow_indexing":true,"sort_order":1,"total_views":1876,"date_published":"2024-06-25T11:14:08","date_updated":"2025-05-16T19:13:58.25","date_created":"2025-04-23T17:17:22.32"}}}