Redirecting donors to a custom thank you page

If you prefer to send donors to a specific destination after a donation, this is what you need to do.

Our thank you panel in the checkout process is powerful - it shows up in the checkout flow without requiring a page redirect, it offers social sharing options, and it keeps them in the same interface which provides customer reassurance. However, we know that in some cases, you need to provide more specific or customized information, and in those cases, we allow you to do so via the successUrl parameter! 

 


What's a parameter?

Fundraise Up Elements give you links, either by giving you a direct web address you can paste somewhere or by giving you HTML that puts a fancy link on your pages.

Those web address always have a ? in it, after which form=FUNXXXXXXXX displays.

That question mark means that everything after it, separated by ampersand (&) symbols, are URL parameters, which can pass their values into the loaded page.

Most URL parameters expect a value, so with our links that specify that form=FUNXXXXXXXX displays, we're passing in "there is a form, and it corresponds to FUNXXXXXXXX, which is the ID for a Campaign". 

For our thank you pages, we use the parameter successUrl, which is a parameter that says "whatever my value is, go to that address after the donation is completed"!


Adding successUrl to an HTML Element

When you're in the Element selection area of Fundraise Up, and you choose to add a donate button or form, we provide you with a string of HTML called an <a> tag, which produces a link that our installation code detects and makes fancy and functional. 

So, if I want a donate button that sends people to my thank you page, I'd adjust my HTML as per this example:

<a href="?form=FUNXXXXXXXX&successUrl=https://www.example.com/thank-you&type=button&align=center&color=2077d4&size=45" style="display: none">Donate</a>

This section covers our process for the previous iteration of Elements - we are looking at how best to include this feature for Campaigns and Elements moving forwards. 


Adding successUrl to an address-based Element

When you're in a Campaign in the Dashboard of Fundraise Up, and you click the copy icon next to Checkout URL, we provide you a web address directly for use with emails, direct communication, and anywhere else where you can't display HTML. 

So if I want to adjust the provided address, and the following are true:

  • my site lives at https://www.example.org
  • the Checkout URL copy button gave me https://www.example.org/?form=FUNXXXXXXXX
  • and my thank you page lives at https://www.example.org/thank-you

My address inclusive of that thank you page would be:

  • https://www.example.org/?form=FUNXXXXXXXX&successUrl=https://www.example.org/thank-you

 


What is available for your custom thank you page?

When we redirect a donor to your provided thank you page, we add following parameters to the landing address so these can be picked up by the destination as needed and possible:

  • donationId — unique donation id
  • amount — donation amount in XX.XX format. E.g. "10.20", "10.00"
  • currency — currency code. E.g. "USD", "EUR"
  • monthly — "true" / "false"
  • supporterFirstName  and  supporterLastName — first and last name of the donor
  • supporterEmail — supporter email
  • designationId — designation ID if designation was selected
  • designationName — designation name if designation was selected

Your final thank you page URL will look like this:

https://www.example.org/thank-you
?donationId=DTECRHJM
&amount=26.50
&currency=USD
&monthly=true
&supporterFirstName=John
&supporterLastName=Salmon
&supporterEmail=johnsalmon%40gmail.com
&designationId=DXXXXXX1
&designationName=Where%20it%20is%20needed%20most

 

Keep in mind that a successUrl redirect replaces the Fundraise Up Thank You screen wherein donors are encouraged to share their donation social media.