Building a (Long) Petition with Civicrm

Jump to: navigation, search


We're going to use Drupal 7, CiviCRM, and two drupal modules: webform and webform_civicrm.

Civi recommends surveys for a small number of questions, and petitions for longer questionairres. Each submission becomes a "Petition Signature", and is captured as an activity of type "Petition Signature".

Petition Setup

Normally, a petition consists of two profiles (a CiviCRM "profile" is a set of fields). There's a contact field to gather information about the signer, and an activity profile to hold petition-specific fields. With webform_civicrm, it seems as though we can skep the Activity Profile.

The built-in "Name and Address" profile seems suitable for contact information.

Custom Fieldset

All of our questions will reside in a custom fieldset. There will be one field for each question, and the fields will hold form submission data.

It's helpful to code field names: use the first few letters to indicate what section of the form the field corresponds to, followed by a short phrase describing the question itself. The person filling out the form won't see these coded labels; we'll use webform to relabel the fields.

Here's a screen capture of a custom fieldset.



Webform_civicrm allows you to use Drupal's webform module as the front-end for CiviCRM activities (e.g., the intake petition). Within webform setup we'll

  • Enable CiviCRM processing
  • Choose contact fields to associate with the form
  • Switch to the the Activities tab, choose "Petition Signature" as the activity type, add all fields from our custom fieldset
  • Name the webform

From there, we lay out the form fields


As you can see, I've changed the field name, to look more like "real" questions.

Several form elements are "page breaks". This allows one to break a long petition into a series of pages.

Some pages begin with a "Markup" field (e.g., "instructions", above). This is useful for adding instructions at the top of the page.

You can spend a lot of time tweaking form layout. For example

  • Deciding whether labels appear above or to the left of input elements
  • Adding symbols before or after fields. For example "%", to indicate that the a percentage value is expected.
  • Providing field validation where appropriate. For example, if a field is supposed to have a value from 1--100, you can add a validation check to enforce this.

Webform has other feature that are useful for long forms:

  • Adding a progress bar
  • Enabling "Save Draft", so a person can start the form in one sitting, and finish in another.
  • Automatically saving drafts between pages. This is a good way to ensure that work doesn't get lost.