Form Handlers

In this workshop you will create a form handler to capture form data from an external website and create Lead records using flow.

Configure CORS Allowlist

Cross-Origin Resource Sharing (CORS) allows web browsers to request resources from other origins. To allow access from JavaScript code on an external web page to Salesforce, you will need to add an origin serving the request code to the CORS allowlist.

1. Click on the icon and click the first Setup menu item.
2. In the Quick Find field, enter CORS and select CORS from the Security menu.
3. Click New.
4. Enter https://cdpn.io in the Origin URL Pattern field.
5. Click Save.

Create Form Handler

1. Open the Marketing app from App Launcher .
2. Click on the Content tab.
3. Select Content Workspace for Marketing Cloud from the list view.
4. Click Add and choose Content.
5. Select the Form Handler radio button, then click Create.
6. Click Add Data Source.
7. Enter CRM_Leads in the Name field.
8. Select Lead from the Object Menu.
9. Leave the Record Type as Lead.
10. Click Save.
11. Click the icon on the canvas.

1. Enter First Name in the Search field and select First Name.
2. Repeat the previous 2 steps to add Last Name and Email fields.
3. Click on each form component and enter the corresponding values in the External Field Name fields as follows:

• First Name: firstname
• Last Name: lastname
• Email: email

4. Expand the Details section and enter CRM Leads in the Title field.
5. Expand the Submission Redirect section.
6. Enter https://mock.httpstatus.io/200 (or any public URL) in the Success Page URL field.
7. Enter https://mock.httpstatus.io/400 (or any public URL) in the Failure Page URL field.
8. Click Save.
9. Expand the Flow section and click New Flow.
10. Click Publish
11. Click Next in the Publish Content dialog
12. Click Publish Now.

Add Code to Web Page

1. Expand the Code Snippet section.
2. Click on Copy below the Tracking Script section.
3. Click here to open a code editor in a new browser window.
4. Paste the code in the HTML panel.
5. Return to the Form Handler page and click on Copy below the Form Attributes section.
6. Paste the code directly below the code you previously pasted.
7. Copy the following code.

  <div>
    <label for="firstname">First Name</label>
    <input type="text" name="firstname" required>
  </div>
  <div>
    <label for="lastname">Last Name</label>
    <input type="text" name="lastname" required>
  </div>
  <div>
    <label for="email">Email Address</label>
    <input type="text" name="email" required>
  </div>
  <button type="submit">Submit</button>

10. Place your cursor before the closing </form> tag in the HTML panel and paste the code you just copied.
11. Complete the form fields.

12. Click Submit.
13. Return to Salesforce and open the Marketing app.
14. Click the Leads tab.
15. Confirm a new Lead record appears in the list view from the form data you submitted.

Further Reading

Connect External Forms to Salesforce Objects with Form Handler

Awesome work!

You’ve created an external form hander in Agentforce Marketing.