Save Squarespace Forms to Salesforce

Posted on Mar 02, 2015 in Code
james portrait
James Jacoby
Chief Technology Officer, Founder

Squarespace offers a powerful form builder, but storing the data is limited to a few basic options. Clients often need something a bit more sophisticated to integrate with Salesforce. We wrote a quick JavaScipt plug-in that allows any Squarespace form to be saved as a new Salesforce lead.

Features:

  • JavaScript only - works with standard or developer mode on Squarespace
  • Easy to setup using Salesforce's Web-to-Lead feature
  • Compatible with standard lead fields and custom fields
  • Once established, no code to write when editing forms
  • Retains all existing Squarespace form features

Requirements:

  • Squarespace site
  • Salesforce account
  • Some knowledge of JavaScript

Installation

To get started, log in to Squarespace and design your form. For best results, use the following fields names, which will be automatically mapped to Salesforce fields.

  • Name
  • Company
  • Email Address
  • Phone
  • Lead Source (hidden)

Don't forget to setup any standard Squarespace storage options and your confirmation message.

If you're using the standard platform, add this gist code (salesforce.js & site.js) somewhere on your site. If you're in developer mode, save the squarespace.js file to your scripts folder and add the contents of site.js somewhere appropriate.

Configuration

Head over to Salesforce and navigate to the Web-to-Lead customization section, which can be found under Setup » Build » Customize » Leads » Web-to-Lead. From here you can edit who the lead creator will be, as well as create a new form; which is how we'll find out what the secret URL is we will post the form results to.

Click "Create Web-to-Lead Form" and then "Generate".

Don't worry about the fields, they don't matter.

Generating the Web-to-Lead form

The resulting code block contains your "oid", a unique identifier for your organization. Find it in the code blob and copy the value for the next step.

<input type=hidden name="oid" value="###############">

The final step is to modify the provided code in site.js by pasting in your own oid around line 19.

Wrap Up

If installed correctly, all forms on your site will now post to Salesforce. I suggest giving each form its own lead source so you can tell which form was used to generate the lead.

To exclude some forms from the integration, modify the selector in site.js to be more specific.

Happy Squarspacing!

Swift Delays Late Joining Game Center Matches