Skip to main content

Daisy chaining forms

Daisy chain illustration. One form connects to another and it connects to a third.

Daisy Chain

Interconnecting one page to another. Make custom user journeys. Make them aweseome.

You can daisy chain your forms across multiple pages. That is, you can link forms across multiple pages to build multi-step experiences (e.g. letting people make a one-off gift and then convert to a regular gift).

For example, say we want to provide an upgrade option.

View demo.

For this, we want two donate pages, with a different donate form on each page.

On the first page, we let supporters make a one-off gift:

  <p>Hi, can you support the cause with a $10 donation?</p>

  <div
    id="gpap-donate-widget"
    data-amount="10"
    data-donate-button-label="Donate today"
    data-form-variant="mini"
    data-frequency="once"
    data-salesforce-campaign-id=<MANDATORY SALESFORCE ID>
    data-redirect-url-success="http://greenpeace.org.au/single-gift-thanks"
  />

upon completing the donation, the supporter is taken to the page set as data-redirect-url-success above, which thanks them and asks to upgrade to a regular gift. The single donation they already made will be considered the start of a regular (4-weekly) gift, so we will setup the recurring donation to start in 4 weeks (28 days) by using data-trial-days="28":

  <p>
    Thanks for your one-off gift! Support from amazing people like you helps us
    help the whales and fight for climate action and run campaigns here in
    Australia and all around our planet.
  </p>

  <p> Are you able to continue your support and commit to a regular $10 gift?</p>

  <div
    id="gpap-donate-widget"
    data-trial-days="28"
    data-amount="10"
    data-donate-button-label="Donate regularly starting in 4 weeks"
    data-form-variant="mini"
    data-frequency="recurring"
    data-salesforce-campaign-id=<MANDATORY SALESFORCE ID>
    data-redirect-url-success="http://greenpeace.org.au/regular-gift-thanks"
  />

And that's it. We've linked a one-off donate page to a thank you page (/single-gift-thanks) which has a regular gift donate form that jumps to /regular-gift-thanks upon successful donation.

Technical History​

For context and screenshots see the original implementation (code) pull request here.