Pre-fill Forms from Links or Webpages

ClickDimensions / By

ClickDimensions includes a great profile management feature, but it is works only when an email is sent with a link to the profile management form, and is limited to data that is on the recipient’s contact or lead record in CRM. It has the advantage that it can all be configured in a graphical UI, but in some scenarios, you might want additional flexibility. Here’s a way you can pre-fill forms using URL parameters and a little javascript.

We’ve kept this example simple to illustrate how it can be done. This form has been pre-populated with an email recipient’s first name, last name, job title and email address. (You can also use this technique without sending email, as long as you have a way to add useful parameters in the form’s URL.)

image

Here’s how this was done:

  1. Use our form designer to create a form. Here we have added fields for first and last name, job title, and email address. Notice the “Code Editor” button. We’ll come back to that in a moment.
    image
  2. Next, we’ll want to get the IDs for each of our fields. Click the “Embed” button and then click the link to where the form is hosted. With the form now open in your browser, you can view the HTML source and locate the IDs of the fields. Copy the fields IDs to add them to your javascript in the following steps.
    image
  3. Back in the Form Builder, click on “Code Editor”. We’ll be inserting some javascript.
    image
  4. Here’s the javascript you’ll want to insert. You can download this sample here. (Note that this is a sample, and will need to be modified for your requirements by a web developer.)
    image
  5. In my email template, I add a link to the form I designed, and I also add parameters to the URL and placeholders where the first and last names, job titles, and email addresses for each recipient will go. The parameters I’ve added to the form’s URL match what I have in the javascript above.

    image

Now, when I send the email to a recipient, the link will be personalized for each recipient, and the javascript will fill in the fields automatically.

There are other scenarios where this can be used. Instead of building the URL and its parameters in an email template, you could build it on your website. For example, if you have a product catalog, with links from each product page to a form where prospects can request a quote, you can pass the product ID and other information to the form via the URL so your prospect doesn’t need to type it in. There are endless possibilities!

Happy Marketing!

Powered by WPeMatico