Pardot Inspiration: Using Pardot for Event Registration

This month I was challenged with creating a landing page for event registration using Pardot. The event had 15+ roundtable sessions in the morning (within 2-time slots) and an option to register for the afternoon session (keynote, happy hour etc). Here’s a sneak peak into how I built it along with some code if you want to try building something similar for your next event.

How it Works

Before we get into the details, here’s a high-level breakdown of how the page works.

  • A user clicks on the ‘register’ button to sign up for a roundtable, the roundtable name is populated in a hidden form field.
  • A user clicks on the ‘register’ button to sign up for the conference, a hidden form field is set to TRUE
  • A user then enters their information into a form. The data is sent to Pardot using a form handler.
  • Users who signed up for at least one roundtable are sent a Pardot email that contains a thanks for registering message, the name(s) of the selected roundtable(s) and a calendar invite.
  • Users who didn’t sign up for any roundtables, but signed up to attend the conference, are sent a thank you email with a calendar invite.

Pardot Setup

Field Creation

First, I needed to create a couple of new fields in Pardot:

  1. Roundtable Name 1: This field will contain the name of the roundtable the attendee selects for the first time slot.
  2. Roundtable Name 2: This field will contain the name of the roundtable the attendee selects for the second time slot.
  3. Registered For Conference: This field is a checkbox (true or false) which will indicate that the attendee has selected to attend the conference.

Form Handler Setup

I opted to use a form handler instead of a Pardot form, so I could easily customize my form.

Field Mappings

I added all the standard fields to the form handler (first name, last name, company name, job title, opt-in, and email address). I also added the 3 new custom fields (roundtable name 1, roundtable name 2, registered for conference) and marked them as not required since the attendee doesn’t have to go to all 3 events.

pardot-form-inspiration-field-mappings

Completion Actions

I added 2 completion actions, the first one is to sync the prospect to an SFDC campaign with the status of registered, the second completion action is to send me an email alert when someone registers. The email notification helped me easily determine which roundtables are most popular.

Thanks for registering email confirmation

I created 2 ‘thanks for registering emails’ and set them up to be sent via an automation rule.

  1. Conference Only: This email is sent out to everyone who didn’t select to participate in any of the roundtables.
  2. Roundtables: This email is sent out the everyone who registered for at least one roundtable session.
Conference Only Email

The conference only email was pretty simple. It contained a thank you message along with calendar invites.

The email was sent using an automation rule that checks if conference only is true and if both roundtable fields are empty.

pardot-automation-rule-conference-only

Roundtable Email

The roundtable email contains a thank you message as well as the name(s) of the roundtables the user has selected to attend. The names of the roundtables are dynamically added to the email using a variable tag.

roundtable-selection-pardot-inspiration

The email was sent using an automation rule that checks if the roundtable 1 field is not empty OR the roundtable 2 field is not empty.

pardot-completion-action-send-roundtable-email

Building the Landing Page

Building the landing page was the difficult part. I didn’t want to include the roundtable names in a drop down menu in a form, so I came up with the idea to make the registration process like a shopping cart.

The HTML

I used Bootstrap as my framework for the landing page and used Bootstrap Panels for a clean way to display the roundtable names and descriptions.

Since there were 2 timeslots for the roundtables I wrapped each of the sections in a DIV with a class of first-session and second-session.

Sticking with the ‘add to shopping cart’ feel, I wanted to add a your agenda section to the bottom left corner of the page that populates based on the sessions you select. This can be done using my slide out lead generation form with a couple modifications.

Finally, I added the form to the bottom of the page, which uses a Pardot form handler and hidden fields for roundtable name and conference registration.

JavaScript

I used jQuery to add some logic to my page. There was a fair bit of logic to consider for the roundtable registration, including:

  • Changing the button style when a session is selected.
  • Hiding the rest of the ‘register’ buttons within that time slot, so the attendee can only select one session.
  • Displaying the name of the selected roundtable in the agenda section.
  • Populating the hidden fields with the name of the selected roundtable.

The entire HTML code

I created a new landing page in Pardot to host the registration page. All the CSS, javascript and Bootstrap files were also uploaded in Pardot to keep everything in one place.

The Entire JavaScript

Questions?

Send them to me via email, send me a tweet @jennamolby, or leave a comment